EWWW Image Optimizer started as a lossless optimizer, because quality has always been important to me. Grudgingly, I tested several lossy compression tools and said, “Hey, these are pretty good!” So good, you usually cannot spot the differences. Then came WebP and it was different, not a lot, and most folks would never notice. But some of you notice, yeah, you know who you are!
However, WebP is so good at compression that we tend to forgive it if the quality isn’t as good. After all, we’re putting these images out there on the web, often on small screens, and speed is king. But what if we could do better? Wait, is that even a thing?
The Rub
Here’s the deal: when you upload an image to WordPress, it creates a bunch of smaller versions of that image. Again, these are for the web, and 99% of the time, we don’t need a 50 megapixel image. Shoot, we don’t even need 12 megapixel images! We want an image that fits the space we put it in, and that’s often much smaller than the image we upload. So WordPress has our back, scales down the full-size image to a sane 2560px, and then creates a variety of (smaller) image sizes that will take care of most uses.
Therein lies the problem, because scaling an image down is a lossy process, and we’ve potentially just done it twice. Now, most (if not all) image optimization plugins are creating WebP images directly from those smaller images, so, uh… third time’s a charm? Hardly! To be fair, it isn’t horrible, and you can enable the Sharpen setting in EWWW IO to make it better. Again, most folks won’t notice, but the purists among you have opined that there has got to be a better way, and there is…
The Source
What if, instead of creating WebP images from a resize of a resize, we created them from the original and did the resizing at the same time? Can we do that? You bet! The cwebp utility that we use for both “local free” mode and API-based WebP conversion has resizing built-in. Alternatively, if the version of ImageMagick on your server supports WebP, we can effectively do the same thing there.
As of EWWW IO 8.0, not only does the plugin use the full-size image to create WebP thumbs, it even looks to see if there are pre-scaled originals. Again, some of you will look at these and wonder, “Is there a difference?” I’ll provide some sample images, where it is best to open each in a separate tab so you can compare. The most noticeable changes are around text, hard edges, and textured surfaces. The newer conversion process also produces less artifacts since it comes directly from the original image.
Without further adieu, here they are:
More Goodies
The latest release of EWWW IO also includes WebP Optimization for those of you who are uploading WebP images directly instead of JPG/PNG. It isn’t on by default, but can be enabled in Ludicrous Mode under the Local settings. This can save 10-20% more on the already highly efficient WebP format, so it’s a nice boost, thanks to our friends at Tinify.
We’ve also move the “above the fold” setting from an override into the UI, so you can easily set how many images EWWW IO’s lazy loader should consider as above the fold. Be careful with this setting if you are using Auto-Scaling and those “above the fold” images need scaling. In that case, you should leave the setting at “0” and let auto-scaling continue doing it’s magic on those images.
There are a whole host of other improvements in EWWW IO 8, so download it today and make your images faster (and clearer) than ever before!
