One of these contenders is AVIF. Unlike its predecessors, this image format seems likely to lay GIF to rest once and for all finally. AVIF is based on the AV1 video codec and was released in 2019. While it is relatively new on the block, some excellent specifications and features make AVIF an up-and-coming file format indeed. Here are the two contenders compared side by side.
When you convert to GIF, the image encoder does its best to approximate the color. Still, with such a limited range of available shades, it isn’t easy to create a GIF and preserve the color reproduction.
AVIF has a max color depth of 12 bit, providing a palette of 4096 colors.AVIF supports a high dynamic range (HDR) and includes support for wide color gamuts.
As an image format derived from a video codec,AVIF has an image resolution limit of 8193 x 4320 – the size of an 8K video frame.It is however possible to push past this limit through independently encoded tiles. But, the edges of each tile (at max 8K resolution for each) suffer from nasty artifacts, making AVIF unsuitable for large resolution images.
GIF images can reach a theoretical max resolution of 2,147,483,647 x 2,147,483,647pixels or 2500 megapixels. However, as we will make clear in the next section, most users will find it hard to work with ‘HD’ images, let alone ones surpassing the 8K limit AVIF has.
AVIF offers both lossy and lossless compression, with its low-fidelity lossy compression showing off the format’s greatest strengths. For example, a 347kb animated GIF can be converted through avif.io to be a whopping 91% smaller at 32kb just by encoding in AVIF. The traditional downside of lossy compression is low quality or “appeal”: simply how good the image looks. AVIF’s low-fidelity (and therefore small file size) images have high appeal and so don’t suffer from artifacts like color banding.
GIF’s poor compression is one of the driving forces behind why GIF images tend to look so bad. For an animated GIF to be encoded at high quality, the file size would be enormous. For a file format that is so favored for web delivery, its users have to use low resolution, low fidelity images to try and keep the file size to a web-safe amount. AVIF’s excellent lossy compression makes this worry a thing of the past.
AVIF supports parallelism. Instead of limiting the task of encoding or decode an image to one CPU core, parallelization allows multiple cores to work in parallel with each other to speed up encode and decode times. GIF is an entirely sequential codec and can only take advantage of one CPU core.
This wasn’t a problem in the 1990s, where most computers were single-threaded, but modern CPUs have multiple cores and multiple threads. With the computer market trending toward higher core counts, an image codec’s ability to take advantage of multi-core performance will become increasingly important.
As it can utilize multi-core processors,AVIF is significantly faster to encode and decode than GIF.
While GIF was the first image format to support animation, it is left in the dust by AVIF in some key areas.AVIF uses interframe compressionwhere only the differences between frames are encoded – a feature inherent in video codecs to avoid astronomical data sizes. GIF uses intraframe compressionfor its animated images. Each frame is encoded in total,leading to much larger file size.
AVIF supports transparency, whereas GIF does not. The overlay feature of AVIF allows images to have multiple layers. This is fantastic for animated images as a separate layer can be animated (for example text or a graphic), preserving crispness and improving file sizes.
AVIF is a new format and therefore hasn’t been adopted fully. Google Chrome has supported AVIF since Chrome 85. At the same time, Opera and Samsung Internet have also implemented full support for still and sequenced images. Firefox doesn’t officially support AVIF, but still image support can be enabled in about:config. This, however, doesn’t include animated image support.
AVIF changes that. This relatively new format’s significant low-fidelity compression, file sizes are significantly smaller with AVIF than GIFs of the same quality. This allows for animated images to finally have the fidelity and resolution of videos while remaining in an easy-to-deliver image format. With support for HDR images and 12-bit color, AVIF has better image quality and is much more capable than GIF. Parallelization offers some neat encoding and decode speed gains through multi-threading, especially as single-core (and even dual-core) processors have become a thing of the past. The most significant thing holding it back is the lack of browser support. However, with the big players in web browsing working on bringing sequenced AVIF support to users worldwide,we expect AVIF to become the dominant image format for both still and animated images for the web.
Animated AVIF images have much smaller file sizes and can take advantage of multi-core processors. These two features combined make AVIF animations much faster to load. The reduced file size alleviates the stress of bandwidth limits and data caps. This is because AVIF images can be compressed much more efficiently while still retaining the image quality. This allows image makers to upload better quality and higher resolution animated images without worrying about data size limitations.
The biggest downside currently to AVIF is its lack of support from some key web browsers. Google Chrome fully supports AVIF. However, Firefox and Safari have yet to support animated GIFs.
The good news is that this is another area where significant results can be achieved with relatively little effort. You can reduce your bandwidth requirements by converting large GIFs to videos. A video must be able to reproduce the following three characteristics of animated GIFs:
- ✓Playing automatically
- ✓Looping continuously
- ✓Being silent
1<video autoplay loop muted playsinline></video>