ARCHIVED: What is the difference between an interlaced or progressively rendered image and a normal one?

Interlaced or progressively rendered images differ from normal images in how they are displayed. Normal or baseline images are typically rendered from left to right and top to bottom, meaning that you cannot make the entire image out until it finishes loading on the page. By contrast, progressively rendered images allow you to get an idea of the entire image before it has completely loaded. Often, when an image is first displayed, it looks out of focus, but as it continues to load, it will become progressively clearer. This is especially advantageous when viewing images over a slow Internet connection.

Three formats are typically used to display progressively rendered images:

Interlaced GIF

Progressively rendered GIF files, called interlaced GIFs, use a protocol that is simpler and somewhat more crude than that of PNG or JPEG files, but are almost universally viewable by applications capable of displaying GIF images. An interlaced GIF doesn't display its scanline linearly from top to bottom, but instead reorders it so the content of the GIF becomes clear even before it finishes loading. For example, the GIF viewer may display lines at the top of the image, then in the middle, then at the end, and will continue to fill in the blanks until the image is completely loaded. Many web browsers will use the lines that have been loaded to fill in the empty lines, making it appear as though the image is coming into focus. Interlaced GIFs are often larger than normal GIFs, though the difference is usually slight.

Progressive JPEG

Progressive JPEGs are similar to interlaced GIFs, but their rendering scheme is usually superior to that used with GIFs. With some applications, it is also possible to tweak the order in which the scanlines are displayed. Unlike interlaced GIFs, progressive JPEGs are often smaller than their baseline counterparts; with slower computers, however, they take longer to display.

PNG

PNG files are often progressively rendered two-dimensionally. This is done by changing the order in which pixels, as opposed to scanlines, are displayed. While a progressive JPEG or interlaced GIF progressively renders an image by changing the order in which horizontal lines load, a PNG can change the order both horizontally and vertically. This means that an image becomes recognizable even earlier in the loading process.