Image size differences between older install and v6.2.5

[jgrims91]

I have two instances that are pulling an image from the same bucket, but are compressing them differently. One is a legacy 2019 era install and the second is a more version 6.2.5. The file size in the bucket is 1,500kb as reflected in the second example below.

In this example on a 2019 install I have a .png that outputs files in these sizes:

281kb <-- https://d11xh0uby8avni.cloudfront.net/products/SPUR24-diesticker.png [no filters]
181kb <-- https://d11xh0uby8avni.cloudfront.net/fit-in/0x1200/products/SPUR24-diesticker.png [resize only]
91kb <-- https://d11xh0uby8avni.cloudfront.net/fit-in/0x1200/filters:format(webp)/products/SPUR24-diesticker.png [resize & webp]

These are the sizes on the 6.2.5 install and has the following outputs

1,500 kb <- https://d3jrzk6hke1xr3.cloudfront.net/products/SPUR24-diesticker.png [no filters]
873kb <- https://d3jrzk6hke1xr3.cloudfront.net/products/SPUR24-diesticker.png/fit-in/0x1200 [resize only]
97kb <- https://d3jrzk6hke1xr3.cloudfront.net/products/SPUR24-diesticker.png/fit-in/0x1200/filters:format(webp) [resize & webp]

It seems like the 2019 install outputs a smaller file size across the board. With the webp filter it is more comparable, and with just a .png resize it is pretty dramatically different. Wondering if other have had a similar experience and if there are more tips for optimizing files on a newer installs compared to older.

I would just use the 2019 install, but I do want a feature on the newer install, so wondering if there are more setting to optimize compression.

Any insights would be welcome and much appreciated! Thanks!

[simonkrol]

Hi @jgrims91,
That is quite peculiar, I'll take a look and see if I can figure out what causes the old files to be so much smaller.

Do you happen to have the version of the old install? You should be able to find it towards the end of the description of the CloudFormation stack.

Thanks,
Simon

[jgrims91]

Hi, thanks for looking! This is was it at the top of the Template on the Cloud Formation, does this help?

AWSTemplateFormatVersion: 2010-09-09

Description: >-
(SO0023) - Serverless Image Handler: This template creates a CloudFront
distribution and an AWS API Gateway to provide an easy-to-use image
manipulation API based on Thumbor. Template Version 2

[simonkrol]

Hi @jgrims91, Yep that's perfect, looks like you're running V2.0.0.

The main factor here is that versions prior to v4 use Thumbor to provide image processing, while versions v4+ use the npm package Sharp to process images. While I haven't personally worked with Thumbor, it appears that it provides some default processing/compression of images to reduce their size.

After some investigation on the Sharp side, it does appear that the default quality for PNGs is 100 (unlike for many other file types, which is why you didn't see this issue when converting to WebP), so this issue would be exacerbated when using PNGs. If you have a chance, I'd be interested to know what sort of size differences you see when using a JPEG.

Either way, if you'd like your new SIH instance to perform more like the old one when it comes to sizing, you can include the filters:quality(80) filter (for Thumbor-style requests), or {edits: {quality: 80}} for Base64 encoded requests. With the first example you provided, I saw a decrease from 1500kb to 313kb.

If you'd like this to occur for all requests you can use the rewrite feature similarly to how it's used over in the answer of #557

Let me know how it goes,
Simon