Is WebP Really Better than JPEG?

Is WebP Really Better than JPEG?

siipo.la siipo.la5 days ago in #Dev Love35

2020-06-19 If you have used tools like Google’s PageSpeed Insights, you probably have run into a suggestion to use “next-gen image formats”, namely Google’s WebP image format. Google claims that their WebP format is 25 – 34% smaller than JPEG at equivalent quality. When testing out WebP using a perceptual image optimizer, I ran into a peculiar issue: the WebP files were of very similar size compared to compressed JPEGs, in many cases larger. I’m not only one who noticed this, but Mozilla also noted in their 2013 study that WebP doesn’t generally have much better compression efficiency when compared to JPEG. (Note that Mozilla somewhat walked back from this and implemented WebP support for Firefox in 2019) I think Google’s result of 25-34% smaller files is mostly caused by the fact that they compared their WebP encoder to the JPEG reference implementation, Independent JPEG Group’s cjpeg, not Mozilla’s improved MozJPEG encoder. I decided to run some tests to see how cjpeg, MozJPEG and WebP compare. I also tested the new AVIF format, based on the open AV1 video codec. AVIF support is already in Firefox behind a flag and should be coming soon to Chrome if this ticket is to be believed. Images and Tools For the testing I used the Kodak image dataset in 3 different sizes: 500 px, 1000px and 1500px. For JPEG conversion I used cjpeg with –optimize flag, –progressive flag and 4:2:0 chroma subsampling. For MozJPEG conversion I used MozJPEG with –optimize flag, –progressive flag and 4:2:0 chroma subsampling For WebP I used cwebp with -m 6 flag for maximum compression and -af for auto filter which presumably trades encoding time for increased quality. WebP only supports 4:2:0 subsampling so this doesn’t need to be specified separately. For AVIF I used colorist with flags –tonemap off, –yuv 420 and –speed 0 which is the slowest but highest quality encoding In addition to these, ImageMagick was used to scale down the images from the originals and converting between PNG, WebP and TGA (cwebp only supports TGA input). All conversions were done in sRGB color space. For comparing the quality I used kornelski’s dssim utility which calculates structural similarity index between images. My target SSIM is 0.0044 which roughly corresponds to JPEG quality of 85. Results for 500px images Open comparison in a new window Here are the results on a graph: If we look at the median file sizes, we can see that compared to cjpeg, MozJPEG is roughly 11% smaller, WebP is 18% smaller compared and AVIF is 31% smaller at the equivalent SSIM index. Results for 1000px images Open comparison in a new window Here are the results on a graph: If we look at the median file sizes, we can see that compared to cjpeg, MozJPEG is roughly 11% smaller, WebP is also 11% smaller compared and avif is 28% smaller at the equivalent SSIM index. Results for 1500px images Open comparison in a new window Here are the results on a graph: If we look at the median file sizes,  » Read More

Like to keep reading?

This article first appeared on siipo.la. If you'd like to keep reading, follow the white rabbit.

View Full Article

Leave a Reply