AVIF vs WebP

圧縮効率の面では、はい。AVIFは同等の見た目の画質で、WebPより20〜30％小さいファイルになります。また、AVIFはHDRやより広い色域に対応しており、ライセンス上の制限もありません。ただし、現時点ではWebPのほうがブラウザの対応範囲が広く、エンコードも高速です。

AVIFは、Chrome 85以降、Firefox 93以降、Safari 16.4以降、Edge 121以降で対応しています。最新ブラウザの大半はカバーしていますが、古いバージョンや一部のマイナーなブラウザでは対応していない場合があります。

理想は両方を使うことです。HTMLのpicture要素で、AVIFを第一候補、WebPをフォールバックとして配信しましょう。最新ブラウザでは最高の圧縮率を得られ、それ以外のブラウザでも互換性を保てます。

AVIFはAV1コーデックを使っており、計算が非常に複雑です。AVIF画像のエンコードには、WebPの10〜100倍の時間がかかることもあります。そのためリアルタイムのエンコードには不向きですが、画像を一度エンコードして何度も配信するビルド時の最適化には問題ありません。

はい、AVIFもアニメーションに対応していますが、アニメーションAVIFのツールやブラウザ対応は、アニメーションWebPに比べるとまだ成熟していません。アニメーションコンテンツには、現時点ではWebPのほうが実用的です。