⌘K
We use cookies to improve your experience
We use essential cookies to make our site work. With your consent, we may also use non-essential cookies to improve user experience.
Definition
A progressive JPEG is encoded in multiple scans so the full image appears immediately as a blurry preview and sharpens as more data loads. This contrasts with baseline JPEG, which renders top-to-bottom line by line. Progressive JPEGs often produce slightly smaller files at the same quality.
A baseline JPEG stores image data sequentially from top to bottom. On a slow connection, you see the image appear one horizontal strip at a time. A progressive JPEG stores the data in multiple scans: the first scan contains a very low-quality version of the entire image, subsequent scans add detail until the full quality is reached. Users perceive progressive loading as faster because they see meaningful content (a blurry but complete preview) almost instantly.
Counter-intuitively, progressive JPEGs are often 2-10% smaller than baseline JPEGs of the same quality, particularly for images over 10KB. This is because the multi-scan structure allows the encoder to optimize data distribution across scans. Image optimization tools like MozJPEG, which is widely used for web image compression, produce progressive JPEGs by default. The format is universally supported by all browsers and image viewers.
For web images larger than a few kilobytes, progressive JPEG is generally the better choice: slightly smaller files, better perceived performance on slow connections, and no compatibility concerns. The only scenario where baseline might be preferred is when generating many small thumbnail images in a performance-critical pipeline, since progressive encoding requires slightly more CPU time. Most modern image optimization tools and CDNs (Cloudflare, Imgix) serve progressive JPEGs by default.