Resposive images are much larger than the original image

Hi there,
In our application, we are using responsive images by setting up except image resolutions in the custom template. We are having trouble while making an animated webp format image responsive. While adding the original image to the excerpt images, the size of the images is becoming heavy which should not be the case, rather the size should go down to make use of responsive images in an effective way.

Original image: https://images.prismic.io/auto-site/8feda011-4d5c-4268-99ec-7d68b19acc56_prismic_lease_vs_subsc_417x275.webp (Size: ~40 kB)

Excerpt image based on the above original image: https://images.prismic.io/auto-site/8feda011-4d5c-4268-99ec-7d68b19acc56_prismic_lease_vs_subsc_417x275.webp?auto=compress,format&rect=0,0,417,275&w=417&h=275 (Size: ~393 kB over the network)

ref screenshots:


Hey @jpuligundla-contract, welcome to the Community!

This is very strange. Do you see this in the live version of your project? Could you share a link that can point me to where these responsive images are on your site? That way, I can see the rendered version of them.

If I open the links you shared, the sizes are ok.
For the original image, the size is almost 40kb, as you said before:

For the second one, it appears smaller in size, roughly 22kb

Hi @Paulina, thank you so much for looking into the issue.

I made a couple of modifications to solve the above behavior in the Prismic but the problem remains the same where the responsive image's size is larger than the original image.

Here is the page URL What Are Car Subscription Services and Are They Worth It? | Auto.com where we use the original image of 18kB.
And here is the page URL Car & Automotive Advice Blog | Auto.com in which we use the responsive image of the original image with the size of 47kB.

Original Image:

Responsive Image:

Page with the Original Image:

Page with the responsive Image:

Thank you for sending over these details.

Was the image uploaded a long time ago? This could be a possible reason why this could be happening. We don't apply any transformation in the resizing and cropping of old images. We proxy those images through Imgix to compress them and distribute the right format dynamically for each browser.

You can fix this by re uploading the same image and use was instead, so that the image optimization is done correctly.

This issue has been closed due to inactivity. Flag to reopen.