Section 16.15.  Interlacing an Image

16.15. Interlacing an Image

Interlacing an image allows users to see parts of it as it loads, and takes different forms depending on the image type. For example, interlaced JPEGs (called "progressive"), GIFs, and PNG files show low-quality versions of the file as they load. In comparison, non-interlaced JPEGs appear line by line. To enable interlacing on your picture, simply call this function with the second parameter set to 1, or set to 0 if you want to disable it.

Interlacing is likely to affect your file size: JPEGs often get smaller when interlaced because progressive JPEGs use a more complicated mathematical formula to compress the picture, whereas PNG files often get larger. Progressive JPEGs are a mixed blessing, however: Internet Explorer doesn't handle them properly, and rather than showing low-quality versions of the JPEG as it loads, it simply downloads the entire picture and shows it all at once. As a result, non-progressive JPEGs (line by line) appear to load faster on Internet Explorer. Other browsers don't display this problem.

This example shows interlacing in action for PNG files. It's not likely to be very noticeable if you run this on a local web server and/or use small files, because it will be decompressed too fast.

    $image = imagecreatefrompng("space.png");
    imagefilter($image, IMG_FILTER_MEAN_REMOVAL);
    imageinterlace($image, 1);
    header("content-type: image/png");
    imagepng($image);
    imagedestroy($image);