Why the images processed through the Responsive Breakpoint Generator often increase in file size?

Why the JPEGs images processed through the Responsive Breakpoint Generator increase in file size?

When I upload a JPEG image, let's say 1920px and 200Kb, the one downloaded in the zip from the generator with same dimensions (1920px) is much heavier in file size, much more than the original 200kb.

Sometimes it also happens that smaller images are heavier than larger ones.

This always happens when I upload JPEGs, never with WEBPs

Why is that?

[d-mendoza]

@rocc-o I have not been able to reproduce this behavior. Can you share the image that you uploaded? I tried for a few JPGs and PNGs.

@d-mendoza, I don't know how to share on GitHub those images -sorry I'm new here- and my site is still in production, local.

Anyway, as an example, one of the images I've uploaded yesterday was 5120px, 920KB, 96dpi and was returned in the zip from Generator as 5120px, 1.37MB, 150dpi.
All JPEG images that were 96dpi were returned form the Generator at 150dpi with bigger file size, all of them.
May depend on the Retina Resolution option which I've selected on the Generator? I don't think so, seems strange.
It doesn't happen with WEBP at all, though, even more strange...

So, a few minutes ago I've noticed that all my WEBP are 72dpi, and in fact they were returned properly and with same 72dpi.
I guess it has to do with the images at 96dpi - and also I don't need my images at 96dpi for the web, 72 is just fine.

So, in the next couple of days I will reduce all my images down to 72dpi, I will re-upload them on the Generator, and I will let you know if the problem is solved.

Thanks!

ps anyway the Generator is amazing! It saved me a lot of time and taught me to understand how to code in html5 for responsive images - all thos sizes and media. It deserves a World Heritage Site designation!

[d-mendoza]

@rocc-o If you want, you can open a ticket here https://support.cloudinary.com/hc/en-us/ and share the image(s). I tried a few different images with varying DPIs and each one resulted in lower file size images. Can you also let me know the settings you used?

Thank you for the kind words :) I will be sure to let our team know who build out that site and its functionality.

@d-mendoza, another fact that may have caused the issue is that I upscaled the images before to upload them on the Generator. I will try a test with images of original size, 72dpi, ando also 96dpi just to be sure, and I will let you know.

Meanwhile, here's my settings on the Generator:

FULL-SCREEN BACKGROUNDS:
resolution from 640 to 2560
size step 20 (kb)
maximum images 6
retina resolution ON
Art-direction (Portrait and Landscape): Desktop + Small Laptops: Original / 100%; Tablets + Smartphones: 2:3 / 100%

With the above settings I'm uploading an image 5120x2880 in order to cover retina desktops upto 2560px viewport

ps I will surely go with Cloudinary full service on my next project. But at this moment, because of the low budget of this project and the fun I'm having with this fantastic tool, I am enjoying writing code and generating images. Please keep the Generator alive for years to come. Thanks!

[d-mendoza]

@rocc-o I tried upscaling the image as well, no luck. I'll keep trying a few things to see if I can reproduce this case. I appreciate you sending over the additional details. If you do stumble upon any new developments, let me know.

Sounds good, we love the feedback :)

@d-mendoza I've tried again to upload the same images into Generator and were returned with the same issues. I've prepared a ZIP (9.61 MB) with all images in question - original ones plus the ones returned form Generator - and also details of settings and proceedure. Where I can send you the ZIP? Thanks!

[aleksandar-cloudinary]

@rocc-o - Hi. You can send a direct ticket to us (which will allow you to attach files) by using the following link:
https://support.cloudinary.com/hc/en-us/requests/new

@aleksandar-cloudinary @d-mendoza I've just sent the attachment to the link you provided. Waiting for yr reply. Thanks so much!