Webp vs JPG vs PNG actual differences and Solutions for Free Optimizations

Webp vs JPG vs PNG actual differences. A deep dive into optimizing images on a Kinsta-WooCommerce stack once it for all.

Just for reference, the performance of this page itself is quite fast, even with HD & PNG images:

Webp at 1100px wide: 62KB


JPG at 1080px: 107kb & more blurry!


PNG of 1600px wide = 1990KB!!!

Will instantly de-rank the page

Transparent Background is cool, but will cost us in slowness & profit



further investigations when trying to scale images up and down:

Webp forced downscale by 50% via HTML:

retains largest image but scaled down


Webp lazy downscale by 50% via WORDPRESS’s “Edit” pencil icon:

does not use largest image, uses a WORDPRESS generated smaller image instead


What are some solutions?

1. RESIZE all new pics via Imsanity (FREE)

Testing on multiple sites, I have to conclude that Imsanity’s PNG to JPG features do not work.

It’s a free plugin, so we get what we pay for.

Here are the ideal settings for Imsanity, keep it simple, we’ll just use it’s resizing features:

PNG to JPG does not work
PNG to JPG does not work

2. Use the ol’ reliable PNG to JPG plugin (FREE & EASY)

When the simple stuff works better than the bloated stuff, of course:

Here’s the MB’s saved according to the plugin:


Uploaded on: May 11, 2023
Uploaded by: Peter Peng
File name: png-version-2.jpg
File type: image/jpeg
File size: 334 KB
PNG to JPG saved: 1.62 MB
Dimensions: 1600 by 1589 pixels

3. Use KINSTA & CLOUDFLARES built in Image Optimizer for WEBP

bonus: built in minification

ALTERNATIVELY, try the same plugin dev but WEBP version!


Peter Peng

Leave a Comment

Your email address will not be published. Required fields are marked *