The AVIF Mime Type
How to use the AVIF image format in PHP; A1 or AVIF is a new image format that offers better compression than WebP, JPEG and PNG, and that already works in Google Chrome.
By. Jacob
Edited: 2021-08-22 03:11
The content-type (aka. Mime Type) used for AVIF images is image/avif, and the standard file extension is .avif.
AV1, or AVIF, is a new image compression format that generally results in lower file sizes than WebP, JPEG, and PNG; how much lower will depend on the settings used to save or convert your images to AVIF. By using AVIF you may be hit file sizes that are around ~20% lower than WebP, and ~50% lower than JPEG.
A typical header response for a AVIF file may look like this:
HTTP/1.1 200 OK
content-type: image/avif
content-length: 14200
To deliver a image/avif content-type from PHP:
header('content-type: image/avif');
echo $image_data;
exit();
Converting images to avif
Images can not yet be converted to AVIF directly from PHP, but you can still convert images by calling an external command such as the convert command in the ImageMagick suite; to do that you may use the shell_exec function:
shell_exec('convert my-image-file.jpg -quality 50% my-image-file.avif');
Just remember to escape relevant parts of the command:
$path = '/var/www/mysite/images/my-image-file.jpg';
$avif_server_loc = '/var/www/mysite/images/my-image-file.avif';
shell_exec('convert ' . escapeshellcmd($path . ' -quality 50% ' . $avif_server_loc));
Escaping may not be necessary when you check for the existence of the file before trying to convert it, nevertheless, it is still a good practice.
Read: How to test if command exists from PHP
The GD Library does not yet support AVIF files.
Note. You can use Beamtic's file handler class to do this, as it will automatically convert, and redirect .webp images to .jpg. It will even redirect to .avif for clients that supports it.
Test results
To test how much images would be compressed when converted to AVIF, I used the ImageMagick convert command in Linux; this may be executed like so:
convert my-image.jpg -quality 50% my-image.avif
I found that generally AVIF may be around ~20% smaller than WebP, and almost 50% smaller than JPEG.
PNG files
However, when I tried to convert PNG files directly, some of them actually ended up larger when converted to AVIF; the reason for this is unknown. Maybe it is due to the tool that I am using for the conversion.
The reason may be that the result will depend on the size and complexity of the contents of the image. However, if I first converted the file to WebP, and then to PNG, then I was able to reduce the file size by almost 20% in some cases.
Because of the inconsistent results with PNG images, I decided to simply disable automatic conversion of PNG in my file handler class. Besides, some of these files are already highly optimized if you already compressed them with a tool like optipng, pngcrush or advpng.
Files that should not be converted
Files such as PNG, GIF and SVG probably should not be converted since they are somewhat special, depending on the circumstances. Technically .svg is vector based, so you probably rarely want to convert those to a raster format such as .avif.
The problem is that .gif files are animated, and I am not sure how well browsers support animation in .webp or .avif; I simply have not tested that yet.
As mentioned earlier, there also seems to be a problem when converting .png files directly to .avif that causes the file size of the converted file to become larger than the original file.
Both .webp and .avif support alpha transparency, so at least that does not seem to be a problem.
Tell us what you think: