Interlacing is the practice of filling in alternating lines of data in an image, helping to visualize the image before it is completely rendered.
In a ‘normal’ image you see the first row of pixels, then the second line and so on as the image loads from top to bottom. This means you cannot see much about the image until it is virtually all loaded. If you loaded every 4th (or 2nd or 10th line) of the image first and then filled in the gaps, you would quickly get a rough version of an image onscreen (and our brains are very good at filling in the gaps). The effect is of a poor quality image rapidly loading, which improves as it loads more. This is what interlacing does.
Why is interlacing used?
Interlacing is used to give the user the perception of the image loading faster because you are able to see an unclear version straight away. Now that faster speeds and higher bandwidth are available, for most it isn’t noticeable whether an image is interlaced or not. Nonetheless, it is helpful when the file is large or when the user has a slow connection.
Which formats support interlacing?
The formats that support interlacing are GIF, JPEG, JPEG 2000, JPEG XR, PNG and PGF. Each using achieving it with different algorithms.
JPEG images that are interlaced are called ‘progressive JPEGs’, which is not to be confused with progressive scan for videos.
We have just added interlacing for PNG to our Java Image Library JDeli, you should go check it out!
What are the advantages and disadvantages?
Advantages | Disadvantages |
| The image is visible from the start in a blurry state | The file size is larger |
| The loading time appears to be faster |