Two Completely Different Approaches
Image compression splits into two categories that work very differently under the hood.Lossless compression removes redundancy without discarding any data. The decompressed image is bit-for-bit identical to the original. PNG uses this approach: it applies DEFLATE (a variant of LZ77 + Huffman coding) to find and eliminate repetitive byte patterns in the pixel data. A row of 500 identical blue pixels does not need to be stored 500 times โ it can be encoded as "repeat this value 500 times." You get a smaller file with zero quality change. If you're looking for practical ways to apply this, check out my guide on how to compress images without losing quality.
Lossy compression permanently discards data that the human visual system is unlikely to notice. JPEG uses DCT (Discrete Cosine Transform) quantization: the image is divided into 8x8 pixel blocks, each block is transformed from the spatial domain into the frequency domain, and high-frequency components (fine texture, sharp edges at low contrast) are rounded to zero or low precision. This is irreversible.
Why JPEG Quantization Works the Way It Does
The reason lossy compression can achieve 80%+ file size reduction while looking nearly identical comes down to the biology of human vision. The eye has two types of photoreceptors: cones (color, ~6 million) and rods (brightness, ~120 million). We are much more sensitive to luminance variation than to color variation.JPEG exploits this by downsampling the chrominance channels (color) more aggressively than the luminance channel (brightness). This is called 4:2:0 chroma subsampling โ the color information is stored at half resolution in both dimensions, but the brightness information is stored at full resolution. Most people cannot see the difference.
PNG's Compression Pipeline
PNG compresses in two stages. First, a filter is applied row-by-row: instead of storing raw pixel values, it stores the difference between each pixel and its neighbor. Differences are usually small numbers, which compress much better than absolute values.Then DEFLATE encoding is applied to the filtered data. DEFLATE combines LZ77 (finds repeated byte sequences and replaces them with back-references) and Huffman coding (assigns shorter bit codes to more frequent values). PNG's compression ratio depends heavily on image content โ photographs compress poorly, while flat-color graphics and screenshots compress extremely well.
Want to see this in action? Try the Image Compressor tool to test lossy and lossless compression on your own photos.
WebP: The Modern Compromise
WebP (developed by Google, released 2010) uses a fundamentally different approach:- Lossy WebP uses VP8 intra-frame compression โ consistently produces files 25-35% smaller than JPEG at equivalent perceptual quality.
- Lossless WebP is typically 20-30% smaller than PNG for the same image.
- WebP with alpha combines a lossy RGB layer with a lossless alpha channel โ something JPEG simply cannot do.