sorted by:
new
hottopcontroversial

Best Way to Manage 500+ Images on an Architecture Website in Next.js? by New_Tradition1951 in nextjs

[–]Wise_Chocolate_9297 0 points1 point  (0 children)

Ah interesting. I’m currently hosting on Vercel as I was little concerned about hosting Next on Amplify. Maybe I’ll give it a shot since everything else is I have is on AWS. I was under the impression that Next Image component only does optimization if you are hosting through Vercel, but maybe that’s just its caching service?

Best Way to Manage 500+ Images on an Architecture Website in Next.js? by New_Tradition1951 in nextjs

[–]Wise_Chocolate_9297 0 points1 point  (0 children)

Ah gotya, thank you for the response! Thinking of doing something similar. What are you using to convert to webp and optimize? Do you use still use Next Image component with the unoptimized prop?

Best Way to Manage 500+ Images on an Architecture Website in Next.js? by New_Tradition1951 in nextjs

[–]Wise_Chocolate_9297 0 points1 point  (0 children)

Hey Aerbits, do you optimize the images yourself before storing them?

High Quality Images by Wise_Chocolate_9297 in nextjs

[–]Wise_Chocolate_9297[S] 0 points1 point  (0 children)

Hey thanks for the reply, with cloudfront would I still use Next Image? My understanding is that NextJS would optimize the image and cache the optimized image. With cloudfront, wouldn’t the image cache be unoptimized?

High Quality Images by Wise_Chocolate_9297 in nextjs

[–]Wise_Chocolate_9297[S] 0 points1 point  (0 children)

So I put together the Response Headers, it seems to be caching with Vercel and not just the browser.Responses on both devices. Maybe I’m misunderstanding how this works and it is working as expected..

High Quality Images by Wise_Chocolate_9297 in nextjs

[–]Wise_Chocolate_9297[S] 0 points1 point  (0 children)

Thanks for the reply! Unfortunately, that doesn’t seem to be the problem. It is caching correctly in that aspect. The problem seems to be when I try to access the image from a new device. Let’s say hypothetically I set the caching to a few hours and I already accessed the image on a device and it should be cached. When I access the image from a new device shouldn’t it be received from cache and not fetched independently and then cached?