Avoid doubled thumbnail downloads

[fte378]

This change avoids downloading the thumbnails two times because of different URLs for the background images and the thumbnails themselves.

Possibly the problem arises only when not using the directory directive and using absolute paths in the figure tags. When using absolute paths the background image gets a doubled slash (from baseURL and thumbnail path). Reason for the doubled image download is the different construction of the URL for the thumbnail itself and for the background image. A possible (alternative) fix might also be to use the same URL in both places.

Demo page: https://xenodochial-bose-2fedbb.netlify.com/2018/12/photoshoot-business/

Fixed page: https://frank.tegtmeyer.net/2018/12/photoshoot-business/

Source code:

`{{< gallery >}} {{< figure src="/img/2018/12/Frank_TegtmeyerPortrait-2017-yXrV-thumb.jpg" size="1333x2000" link="/img/2018/12/Frank_Tegtmeyer__Portrait-2017-yXrV.jpg" >}} {{< figure src="/img/2018/12/Frank_TegtmeyerPortrait-2017-182N-thumb.jpg" size="1333x2000" link="/img/2018/12/Frank_TegtmeyerPortrait-2017-182N.jpg" >}} {{< figure src="/img/2018/12/Frank_Tegtmeyer__Portrait-2017-J42B-thumb.jpg" size="2000x1333" link="/img/2018/12/Frank_TegtmeyerPortrait-2017-J42B.jpg" >}} {{< figure src="/img/2018/12/Frank_TegtmeyerPortrait-2017-aM69-thumb.jpg" size="1333x2000" link="/img/2018/12/Frank_Tegtmeyer__Portrait-2017-aM69.jpg" >}} {{< figure src="/img/2018/12/Frank_TegtmeyerPortrait-2017-vPkv-thumb.jpg" size="1333x2000" link="/img/2018/12/Frank_TegtmeyerPortrait-2017-vPkv.jpg" >}} {{< figure src="/img/2018/12/Frank_Tegtmeyer__Portrait-2017-XWoD-thumb.jpg" size="1333x2000" link="/img/2018/12/Frank_TegtmeyerPortrait-2017-XWoD.jpg" >}} {{< figure src="/img/2018/12/Frank_TegtmeyerPortrait-2017-oeqJ-thumb.jpg" size="2000x1333" link="/img/2018/12/Frank_Tegtmeyer__Portrait-2017-oeqJ.jpg" >}} {{< figure src="/img/2018/12/Frank_TegtmeyerPortrait-2017-vPwa-thumb.jpg" size="2000x1696" link="/img/2018/12/Frank_TegtmeyerPortrait-2017-vPwa.jpg" >}} {{< figure src="/img/2018/12/Frank_Tegtmeyer__Portrait-2017-DYyo-thumb.jpg" size="1236x2000" link="/img/2018/12/Frank_TegtmeyerPortrait-2017-DYyo.jpg" >}} {{< figure src="/img/2018/12/Frank_Tegtmeyer__Portrait-2017-x33r-thumb.jpg" size="2000x2000" link="/img/2018/12/Frank_Tegtmeyer__Portrait-2017-x33r.jpg" >}} {{< /gallery >}}

{{< load-photoswipe >}} `

Check of the results (in the waterfall tab):

https://gtmetrix.com/reports/frank.tegtmeyer.net/P2sLfkYN (fixed version) https://gtmetrix.com/reports/xenodochial-bose-2fedbb.netlify.com/fQSx5X9q (unfixed version)

I checked the doubled download in Safari - the developer tools show that the thumbnails are downloaded twice in the unpatched version.

Regards, Frank

[liwenyip]

Hi @fte378

Thanks for your contribution, and sorry it's taken so long for me to review it.

Have a look at #8 for the history of how we got here :-)

So in this line,

{{ (print .Site.BaseURL $thumb) | replaceRE "([^:]/)/" "$1" }}

Is the idea to replace // with /, but leave :// as is? If so, this looks good to me.

Are there any other places in the code where we accidentally have double slashes in URLs?

Regards, Li-Wen

[liwenyip]

Actually, a more elegant solution might be to use

{{ $thumb | relURL }}

which I think eliminates double slashes.

Would you be able to test this for me?

[fte378]

Hi Li-Wen,

for me the simpler version with using only the thumb variable works. There is no guarantee for all configuration options though - so there might be the danger to break something. I am not aware of any other places where double slashes are generated.

Regards, Frank

[liwenyip]

Hi @fte378,

That's great. Thanks again for your contribution.

Regards, Li-Wen