3 ms·
How do I optimise and convert all my static image files to webp with a PNG fallback, then render them as a srcset so the client can pick the best image? I.e ev
by orf 3y ago
How do I optimise and convert all my static image files to webp with a PNG fallback, then render them as a srcset so the client can pick the best image?
I.e everything that’s done here[1]
Oh no. You can’t. You need to set “images.unoptimized = true” and be happy about it if you’re not using a cloud image service.
1. https://docs.astro.build/en/guides/images/#properties https://docs.astro.build/en/guides/images/#properties
- cyral 3y agoI'm not sure why this is your experience, but the site I am referencing does exactly that. The images are even being pulled from an external domain. They are not PNGs but I am not sure if that makes a difference (they are 100 quality .webp), they get optimized to a lower quality and have srcset, no vercel involved because I do not want a dependency on Vercel.
- 5Qn8mNbc2FNCiVV 3y agoYou just use the image component and specify the sizes. The png fallback is provided via the server looking for the Accept header so when it supports webp it gives you webp, otherwise you get png (or jpg depending on the original extension)