Lossy and lossless compression, explained

Two families of compression

Lossless: the compressed file lets you rebuild exactly the same pixels. That's what PNG, lossless WebP, lossless AVIF and JPEG XL's modular mode do. It works by finding patterns and redundancy, just like a ZIP file.

Lossy: information the human eye barely notices is discarded to get much smaller files. That's what JPEG, WebP, AVIF and JPEG XL do in their usual modes. The rebuilt image looks very much like the original but isn't identical.

The size difference is huge: a photo can take 20 MB losslessly and 1 MB lossy with no visible difference at normal size.

How lossless compression works

Lossless formats combine two steps:

1. Prediction or filtering: instead of storing each pixel, they store the difference from a prediction based on its neighbors. In uniform areas those differences are almost always zero.
2. Entropy coding: the resulting values are encoded so that the most frequent ones take fewer bits.

That's why PNG is very efficient on screenshots, icons or diagrams (lots of flat areas and few colors) and very inefficient on photos (each pixel differs slightly from its neighbor because of sensor noise).

Tools like OxiPNG —which ImageZap uses for PNG— try different filter combinations and parameters to find the smallest representation without changing a single pixel.

How lossy compression works

Modern lossy codecs follow a similar scheme:

1. Color conversion: the image goes from RGB to a space that separates brightness (luma) and color (chroma), such as YCbCr.
2. Chroma subsampling: optionally, color resolution is reduced (see below).
3. Transform: each block is converted to the frequency domain (DCT or similar), separating smooth changes from fine detail.
4. Quantization: this is where loss happens. High-frequency coefficients —fine details the eye notices less— are rounded more aggressively. The "quality" setting controls how much.
5. Entropy coding: as in the lossless case.

Modern codecs (AVIF, JPEG XL) add variable block sizes, more sophisticated prediction and post-filters that remove artifacts, which explains their better performance.

Chroma subsampling: 4:2:0 vs 4:4:4

The human eye is far more sensitive to changes in brightness than in color. Codecs take advantage of this by storing color at lower resolution:

• 4:4:4: full-resolution color.
• 4:2:0: color at half resolution horizontally and vertically —a quarter of the color information.

On photos, 4:2:0 saves a lot and is invisible. On screenshots, colored text, logos or thin red lines on a blue background, it causes blurry edges and halos. In those cases, use 4:4:4 (available for AVIF, JPEG and JPEG XL under Advanced) or a lossless format.

Generation loss

Every time you save a lossy image, a bit more is lost. Converting a JPEG to WebP or re-saving it as JPEG adds a new layer of compression on top of existing artifacts. Tips:

• Always keep the highest-quality original and export from it.
• Don't use quality 100 when re-compressing something already lossy: the file grows without recovering detail.
• If you need to edit several times, work in a lossless format and compress only at the end.

What to choose

Frequently asked questions

Does "lossless" mean you can't see the difference?

No: it means the pixels are exactly the same. High-quality lossy compression isn't visible either, but technically the pixels have changed.

Why is a PNG of a photo so heavy?

Because photos have noise and millions of different colors, without the redundancy lossless compression relies on.

Is lossless WebP better than PNG?

Usually yes: same pixels and around 25% smaller. PNG is still useful for tool compatibility.

Is there a middle ground?

Yes. WebP has a "near-lossless" mode and PNG can reduce its color palette (quantization), which is technically lossy but keeps sharp edges.