Niels-IO / next-image-export-optimizer

Use Next.js advanced <Image/> component with the static export functionality. Optimizes all static images in an additional step after the Next.js static export.
MIT License
460 stars 56 forks source link

Caching question #111

Closed PeterKottas closed 1 year ago

PeterKottas commented 1 year ago

Hey, me again ... Just a question. I wonder what happens with caching. Say I have an image "a.jpg". And I want to update it. a) I change it to a_v2.jpg and it obviously works - it finds and downloads the new version. b) I change it but keep the name. I think this would fail and show the original image, right?

I started thinking about this while we were discussing #109 Can we maybe add a qs param that would be a hash of the actual image content? I know some webpack plugins for images simply add webpack hash, but that means you have to redownload files on every deployment. Is there a chance to do something better here? Just thinking out loud tbh.

This is low prio, just wondering what's the best way, or maybe you already have something in it and I just missed it?

Niels-IO commented 1 year ago

Hi @PeterKottas,

This is covered in https://github.com/Niels-IO/next-image-export-optimizer/blob/c73c09306e6090d93a0306d5925a412c5411eb05/src/optimizeImages.js#L491

It calculates the hash stored in the hash json using the imagebuffer as an input. If the image changes, the buffer changes as well.

Have you noticed a different behavior?

Niels-IO commented 1 year ago

Addition: For remote images, I cannot know whether the image has changed before I downloaded it, and adding the query param as you suggested might not work for some users who have no control over the image in the first place. So the price is always to download all remote images and check against the hash stored in the JSON file.

PeterKottas commented 1 year ago

Many thanks for clearing that up! I just wanted to make sure we're all covered there. Should have looked through the code more and saved you some time. Appreciate the input though!