cli

Après le WEBP, Google Chrome (et Opera) supporte un autre format d’image particulièrement performant : le AVIF, pour AV1 Image File Format. Voyons ce qu’il vaut par rapport au WEBP.



5 min.

Partager l’article Un format d’image plus léger que le WEBP arrive ! sur les réseaux sociaux

Cet article reprend le flambeau de Des images plus légères avec ou sans perte grâce à Webp, dans le sens ou un nouveau format d’image perce en ce moment avec un niveau de compression encore jamais atteint. Ou presque.

Exemples concrets

J’ai commencé à utiliser ce format sur différents projets, dont mon blog technique que vous lisez en ce moment même.

Plutôt qu’un long discours, voyons ce que son utilisation donne réellement avec ces différents projets.

Le blog

Les images de couverture des articles du blog que vous lisez actuellement :

echo -e "JPEG :" `du -cb source/_posts/*/cover.jpg | tail -n 1`  && \
echo -e "WEBP :" `du -cb source/_posts/*/cover.webp | tail -n 1` && \
echo -e "AVIF :" `du -cb source/_posts/*/cover.avif | tail -n 1`

Donne :

JPEG : 1840498 total
WEBP : 583496 total
AVIF : 467819 total

Sur un total de 19 images en 800×400px pour chaque format.

  • Ici, le format WEBP fait en moyenne 31,7 % la taille du JPEG d’origine. Soit un peu moins du tiers.
  • l’équivalent AVIF fait 25,4 % la taille de l’image originale. Soit un quart.

Projet A

Pour un autre projet j’ai 42 images, carrées, de tailles variables pour chaque format avec ceci comme résultat :

echo -e "JPEG :" `du -cb *.jpg | tail -n 1`  && \
echo -e "WEBP :" `du -cb *.webp | tail -n 1` && \
echo -e "AVIF :" `du -cb *.avif | tail -n 1`
JPEG : 922002 total
WEBP : 299280 total
AVIF : 260945 total
  • Ici, le format WEBP fait en moyenne 32,46 % la taille du JPEG d’origine. Presque le tiers.
  • l’équivalent AVIF fait 28,30 % la taille de l’image originale. Plus que le quart.

Projet B

Encore un autre projet, ayant 101 images dans chaque format :

JPEG : 9477198 total
WEBP : 2694428 total
AVIF : 2128490 total
  • Ici, le format WEBP fait en moyenne 28,43 % la taille du JPEG d’origine. Plus que le quart.
  • l’équivalent AVIF fait 22,45 % la taille de l’image originale. Moins que le quart.

Comment je génère mes fichiers AVIF ?

Pour le moment, ImageMagick sur Ubuntu 18.04 ne supporte pas ce format. J’ai donc téléchargé Go AVIF, un petit utilitaire en ligne de commande écrit en Go convertissant des images au format AVIF. Les binaires téléchargeables sont disponibles pour les trois principaux systèmes d’exploitation : Windows, Mac et Linux. Pour les autres systèmes, téléchargez les sources et compilez-les.

Je vous fournis l’aide du programme avif-linux-x64 --help :

Usage: avif [options] -e src_filename -o dst_filename

AVIF encoder

Options:
  -h, --help                Give this help
  -V, --version             Display version number
  -e <src>, --encode=<src>  Source filename
  -o <dst>, --output=<dst>  Destination filename
  -q <qp>, --quality=<qp>   Compression level (0..63), [default: 25]
  -s <spd>, --speed=<spd>   Compression speed (0..8), [default: 4]
  --lossless                Lossless compression (alias for -q 0)
  --best                    Slowest compression method (alias for -s 0)
  --fast                    Fastest compression method (alias for -s 8)

Si vous ne savez pas quoi prendre comme option, contentez-vous juste de convertir avec les options -e et -o pour indiquer le fichier d’entrée et le fichier de sortie. Le résultat obtenu sera déjà très convenable.

Si vous ne voulez pas de perte, ajouter l’option --lossless, pour convertir un PNG par exemple.

Voici pour vous un script Bash très simple pour convertir des fichiers images par lot, à adapter à votre goût :

#!/bin/bash

for img in *.{jpg,jpeg,png,gif}; do
    filename=${img%.*}

    if [ -f "$filename.avif" ]
    then
        echo "$filename.avif existe déjà. Pas de conversion."
    else
	avif-linux-x64 -e "$img" -o "$filename.avif"
    fi
done

Enregistrez-le dans le fichier nommé to-avif puis changez ses droits pour le rendre exécutable et placez-le au bon endroit :

chmod +x to-avif
sudo mv to-avif /usr/local/bin/to-avif

Placez-vous dans un dossier avec plein d’images à convertir et exécutez la nouvelle commande disponible :

cd /mon/dossier/plein/images
to-avif

Le programme met un peu de temps à tourner, il est très gourmand en ressource.

Comment le format AVIF est-il supporté par les navigateurs ?

À la date de rédaction de cet article, le 12 novembre 2020, le site Can I Use montre une très faible adoption par les navigateurs de ce format. Mais, comme dit plus haut, Google Chrome, un des navigateurs les plus utilisés le supporte depuis la version 85.

Le navigateur Opera suit le choix de Google Chrome depuis la version 71.

Pour Firefox, il faut pour le moment activer un drapeau pour l’avoir depuis la version 77. C’est donc inexistant pour le grand public.

De toute manière, il vous faudra utiliser la balise PICTURE et les balises SOURCE pour avoir une image quel que soit le navigateur :

<picture>
    <source srcset="/img/ma-belle-photo.avif" type="image/avif">
    <source srcset="/img/ma-belle-photo.webp" type="image/webp">
    <img src="/img/mabelle-photo.jpg" type="image/jpeg" alt="Mon texte de secours">
</picture>

Pour et contre

Petite note préliminaire : je n’ai utilisé pour le moment que Go Avif, il y a d’autres logiciels disponibles, je ne les ai tout simplement pas encore testés.

Pour

  • Le poids des images obtenues est du même ordre que celles obtenues avec le WEBP, en un peu plus léger.
  • Ce format est supporté par Google Chrome, le poids lourd du marché des navigateurs.
  • Il peut convertir sans perte si on le souhaite (comme WEBP).
  • Il peut convertir des images animées GIF par exemple (comme WEBP).
  • Il est possible de choisir le niveau de compression et de qualité (comme WEBP)
  • Il sera prochainement sur Firefox sans drapeau. Mais quand ?

Contre

  • La différence n’est pas si énorme que cela avec le WEBP en utilisant les options par défaut.
  • Le convertisseur est très gourmand en ressource lors de la conversion (mais vraiment), alors que le convertisseur WEBP (via ImageMagick ou cwebp) est particulièrement véloce. Pensez-y si vous le mettez sur un serveur web…
  • Le convertisseur plante sur des images ayant une trop grande taille.
  • Impossible d’afficher l’image AVIF dans Google Chrome hors du contexte d’une page web. Un lien direct vers une image AVIF n’affichera pas l’image, mais forcera son téléchargement.

Mon choix

Je l’utilise de manière expérimentale pour le moment, sur des projets ayant des images de petites à moyennes tailles, et dont on en maîtrise l’ajout (fiabilité et charge processeur me pousse à être très sage). Idéalement, sur un site statique, c’est parfait. La preuve en est avec ce site.

Pour le moment, si vous avez des photos dont vous souhaitez en réduire le poids numérique, alors restez seulement sur du WEBP. Son support est largement répandu sur les navigateurs, les convertisseurs tournent bien et vite, et le poids obtenu est presque équivalent. Ce sera toujours mille fois mieux que du PNG ou du JPEG de base.

Bref, il faut que le support du format AVIF devienne plus mâture et plus répandu. Considérer-le expérimentalement ou dans des environnements parfaitement maîtrisés.

Photo de Jesper Aggergaard sur Unsplash