There are lots of new image compression formats out there. They excel at taking large, complex pictures and algorithmically reducing them to smaller file sizes. All of the comparisons I've seen show how good they are at squashing down big files.
I wanted to go the other way. How good are modern codecs at dealing with tiny files?
Using GIMP, I created an image which was a single white pixel, and saved it as a PNG. I then used Squoosh to convert it to a variety of modern formats using different encoding options. This is what I found:
This is designed to be the "minimum viable viewable image". I loved Stoyan Stefanov's "Minimum viable no-image image src". That creates a 42 byte SVG with no image data in it - so I thought I'd see what happens if you make a displayable image.
Some important things to note:
- Older image formats like BMP and GIF are smaller than newer formats like AVIF.
- Some compression options make files larger in unexpected ways. The lossy WebP was larger than the lossless version.
- Similarly, increasing the effort on an AVIF can also result in a larger filesize.
- Neither JPEG XL nor QOI are supported in mainstream browsers yet.
- AVIF has a rather long and complex header - that makes sense for large images, but bloats it for smaller ones.
- Using Brotli, it is possible to further compress the AVIF (203 Bytes), JPG (69 Bytes), BMP (63 Bytes), and ICO (30 Bytes) files.
- WebP is the smallest file if you still need a Spacer.gif!
Here's my challenge to you - can you do any better? What's the smallest filesize you can find for a viewable image?