Skip to main content

Lossy Compression of True-color PNG Images

Kornel Lesiński (FT Labs)
Performance
Location: 212 Level: Intermediate
Average rating: ****.
(4.47, 17 ratings)
Slides:   external link

PNG is currently the only image format that works across all browsers and supports alpha channel. Backwards-compatible lossy encoding is much easier to deploy on the Web than a set of vendor-specific alternative image formats, but can still significantly reduce bandwidth and page loading times.

I’m going to present a lossy compression method for PNG images that is based on PNG filters. It’s compatible with the standard decoders and can generate files 20%-40% smaller than a usual lossless encoding.

Unlike conversion of PNG to a palette, this technique works with true-color images.
It can be applied to PNG files as they’re streamed, with relatively little computing power and memory, which makes it perfect for automatic Front-End Optimization tools and proxies.

I’m going to demonstrate tools that designers and developers can use today to recompress PNGs manually or in batches.

Photo of Kornel Lesiński

Kornel Lesiński

FT Labs

Developer at FT Labs — an emerging web technologies team at the Financial Times.

Participant in web standards development at WHATWG and RICG.

Creator of ImageOptim. Independent image compression researcher and developer of lossy PNG compression tools: pngquant2 and ImageAlpha.