Progressive vs. Baseline JPEG: Why Browser Converters Can't Make One
When converting PNG to JPG, most people only think about quality and file size — but JPEG has another, less visible choice baked in: Baseline versus Progressive encoding. At the same quality and the same file size, the way the image appears on screen can be completely different. This guide covers how the two differ internally, and why a JPEG built with a browser's Canvas API always comes out Baseline.
1. How the two differ on screen
Baseline JPEG loads by completing the image top to bottom, one 8×8 pixel block at a time, in order. On a slow connection, you can end up staring at a sharp top half with nothing at all below it for a while. Progressive JPEG does the opposite: it shows a blurry, low-resolution version of the entire image right away, then sharpens the whole thing gradually as more data arrives. Because it creates the impression that "something is appearing quickly," web performance guidance commonly recommends Progressive encoding.
2. Under the hood: one scan, or several?
JPEG divides the image into 8×8 blocks and applies a DCT (discrete cosine transform) to decompose each block into low-frequency coefficients (overall brightness/tone) and high-frequency coefficients (fine detail). The difference between the two modes comes down to how many scans those coefficients get split across when written to the file.
- Baseline: writes every coefficient (low- and high-frequency) for each block all at once, block by block, in order (top-left to bottom-right). Just one scan.
- Progressive: first sweeps through every block writing only the low-frequency coefficients (scan 1), then adds high-frequency coefficients incrementally in later scans — typically 3 to 10 or more scans in total. That's why the first scan alone is already enough to sketch the image's overall shape.
In other words, Progressive JPEG improves perceived load speed by "rearranging the same information in a different order" — it isn't a separate compression algorithm. As a side effect of its more elaborate encoding structure, compression efficiency itself is often slightly better (typically a few percent) than Baseline.
3. Why the Canvas API always produces Baseline only
When you generate a JPEG in a browser with canvas.toBlob(..., 'image/jpeg', quality), the result is always Baseline — regardless of which browser you use. That's because the HTML Canvas 2D Context web standard itself only defines a quality option for JPEG encoding; there's no option at all to specify the scan mode (i.e., whether it's progressive). This isn't a limitation of any particular browser — it's simply outside the standard's designed scope. That means this site's PNG → JPG converter, along with every other browser-based image conversion tool built on the Canvas API, has no way to offer a progressive option.
jpegtran -progressive (a libjpeg-family CLI tool), MozJPEG (cjpeg -progressive), and ImageMagick (convert -interlace Plane).
4. Which should you actually pick?
If you care about site performance (like LCP under Core Web Vitals), Progressive is often the better choice for large photographic images. For tiny thumbnails or icons that load almost instantly either way, the perceived difference between the two modes is negligible — and Progressive's more elaborate structure can even make the file slightly larger. For quick one-off format conversions like the one on this site, Baseline is perfectly sufficient; for images going into a large-scale web service, we'd recommend re-encoding as Progressive through a dedicated image optimization pipeline (e.g., MozJPEG).
Frequently asked questions
Q. Does Progressive JPEG also mean better image quality?
At the same quality setting, the actual image quality is identical. However, because the encoding structure is more elaborate, the file size at a given quality level is often slightly smaller (typically a few percent) than Baseline.
Q. Can this site's converter produce a Progressive JPEG?
No. Since the browser's standard Canvas API itself doesn't offer a progressive encoding option, no browser-based conversion tool can produce one. You'd need a separate program like jpegtran or MozJPEG.
Q. Does support vary by image viewer?
Every major browser and most image viewers display Progressive JPEG correctly. That said, very old image-processing libraries or certain specialized embedded environments may have limited support, so Baseline is the safer choice if universal compatibility is the top priority.