Google Page Speed Insights – Optimize Images

First, don’t let Google Insights drive you to chase an ROI that might not be there. Maybe for 1M of image data improvement, it is worth looking into – but after awhile that tool will have you minifying 1K css files to save 100 bytes.

Second, regarding images – don’t just blindly reduce (‘compress’…really a misnomer) jpeg images. jpeg is a lossy format and if the quality of the images is important to you, you will notice the degradation especially if the image has large areas of similar color value. Blue sky for example – starts to look highly pixelated when you go beyond 10 percent sample reduction.

Did you read the recommended guide for image management:

https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/image-optimization

If the images are yours to modify and they are static, it may be worth spending some time on them with PhotoShop or similar, to see if you can resize or re-sample them. Also keep in mind with proper cache header settings (e.g. in Apache config or .htaccess), your user’s browser is going to cache the static images so will only be “slow” on the first load.

If you are allowing users to upload images then you’ll want to put some constraints on them or programatically re-size them as required.