How JPEG compression works — and what the quality slider really does

JPEG has been the photo format for over thirty years because it made a bet about eyes: throw away what people can't see, keep what they can. Understanding the four steps inside a JPEG explains the quality slider, the blocky artefacts around text, and why saving a photo twice hurts — knowledge that makes the image compressor predictable rather than a guess.

Lossy by design

PNG is lossless: decode it and every pixel is exactly what went in. JPEG is lossy: it discards information the standard's designers judged invisible, and the discarding is what buys a 10:1 file-size reduction on a photograph. The discarded detail is chosen perceptually — fine texture, subtle colour variation, high-frequency noise — which is why photographs survive JPEG well and sharp-edged graphics, text and screenshots do not. How to reduce image file size without wrecking it covers when to use which format.

The four steps inside a JPEG

1. Colour conversion and subsampling. RGB becomes YCbCr — a brightness channel (Y) and two colour channels (Cb, Cr). Eyes resolve brightness far more finely than colour, so the colour channels are usually stored at half resolution (4:2:0), halving the data before any real compression begins.
2. Blocks. Each channel is cut into 8×8-pixel tiles, processed independently.
3. The discrete cosine transform. Each tile's 64 values are re-expressed as 64 frequency coefficients: one for the average brightness, then progressively finer patterns. A smooth tile has energy only in the first few; a detailed tile spreads it out.
4. Quantisation and entropy coding. Each coefficient is divided by a number from a quantisation table and rounded — the lossy step. High-frequency coefficients are divided by large numbers and mostly round to zero. The long runs of zeros then compress superbly with Huffman coding.

What the quality number controls

The quality setting (0–100) scales the quantisation table. At 100 the divisors are 1 and almost nothing is lost, but the file is huge. At 90 the finest detail rounds away and the file is a third the size with no visible change. Between about 75 and 85 most photos remain visually identical at normal viewing size and the file is a fifth of quality 100. Below 60 blockiness appears; below 30 it dominates. The scale isn't linear and differs between encoders, so "quality 80" in one program is not exactly another's — judge by looking, and compress to a target size when the limit is a number of kilobytes.

Where the artefacts come from

Three signatures. Blocking: at low quality, neighbouring 8×8 tiles are approximated differently and their edges show as a grid. Ringing: a sharp edge needs many high frequencies; when they're quantised away, ghost ripples appear beside it — the halo around text and logos. Colour bleeding: subsampled colour smears across sharp colour boundaries, red text going soft on a blue background. Each is a reason to keep text, line art and screenshots in PNG or WebP lossless, and each gets worse every time a JPEG is re-saved, because the rounding compounds: generation loss.

Using it well

• Keep an original (camera file, PNG or high-quality JPEG) and export copies; never edit and re-save the same JPEG repeatedly.
• Quality 80–85 for the web, 90–95 for print masters, 60–70 only when bytes are precious and the image is small.
• Resize before compressing — pixels you don't display are the cheapest to drop (the resizer).
• Use WebP or AVIF where supported: the same ideas with better transforms and 25–50% smaller files (AVIF vs WebP vs JPEG: sizes, support and when to use each).
• Strip metadata: a JPEG can carry tens of kilobytes of EXIF and thumbnails (the EXIF remover).