Chienomi

WebPとAVIF Web編

技術::web

序

AVIFの効力についてはMisskeyで画像を圧縮してドライブや帯域を節約で解説し、高い画質と圧縮効率について言及した。

本記事では、JPEGやPNGではなく、より圧縮効率が高いWebPやAVIFを使うことを前提として、どちらを選択するのがより良いかについて検討する。

WebPとは

WebPはGoogleが2010年に公開した画像フォーマットである。

動画フォーマットであるVP8を用いており、コンテナはRIFF。 可逆/非可逆圧縮, アルファチャンネル, アニメーションに対応。CYMKには非対応。 Googleが作ったことと、その名称の通りWebへの意識が強いフォーマットだ。 “weppy”と発音する。

VP8は特許問題を持っているが、GoogleがMPEG LAとライセンス契約をした上で、Royalty Free License (by W3C)で無償提供しているため、ユーザーにとっての不安はない。

AV1がロイヤリティフリーコーデックだからWebPより安心と言っている人を見たことがあるが、事情はAV1と同じだし、問題そのものはAV1より軽いため、その意味で比較するならVP8のほうがわずかにまし、少なくともWebPになくAVIFにある利点ではない。

WebPはPNGやJPEGと比べ圧縮効率が良いというか、圧縮の余地が大きい。 パラメータを詰めれば、PNG可逆圧縮やJPEG圧縮のように大きな犠牲を払わずとも小さなサイズの画像を生成できる。 ただ、もとがVP8ということもあり、画像ソースに対する得手不得手がある。

WebPはとても嫌われている。 「画像を保存したらWebPという形式でどうすればいいか分からなかった」という、自身の無知と無気力を他人に押し付けるタイプのくだらないものであるから気に留める必要はないといえばないが、実はそれなりに妥当な面もある。

Googleが開発したWebPは、web上のデータ量削減のためのものだ。 Googleの場合、「webのデータトラフィックが減って、情報量が増える」は直接的に利益があるので、基本的には自身の利益のためのことだと言って良い。 WebPはすぐにChromiumでサポートされた。

だが、他のブラウザは追従しなかった。 MozillaがWebPにだいぶ難癖をつけていたが、特にMozillaの姿勢が強硬だった。

ただ、これは技術的な側面より、政治的な側面がある。 GoogleはGoogle Chromeのシェアを盾に、ウェブ標準において「Googleが採用します。だから標準です」という態度を取ることが結構ある。 WebPのときも割とそんな感じだったのだが、これにMozillaがおこだったようだ。

最終的には2019年にFirefox 65でWebPがサポートされたのだが、その時点でもまだSafariは対応していなかった。 SafariがWebPに対応したのは、2020年になってから。

そんな感じでWebPの普及が進まなかったせいか、画像処理プログラムでもWebPに対応しているものが少なく、なかなか表示できるようにならなかった。 なんなら、AVIFのほうが扱いやすいまである。

ただ、FirefoxおよびSafariでのWebPサポートがされた2020年移行、WebPのサポートも進んだため、現在最新の環境であればかなり見られるようになっている。Microsoft Edgeがデフォルトでサポートしているというのもメリット。

AVIFとは

AVIFは2019年にAOMが策定した画像フォーマットである。

動画フォーマットであるAV1と、ISOBMFFコンテナの組み合わせ。 AV1もロイヤリティフリーライセンスとなっている。

WebPと同じようなものだとは言えるが、経緯だけでこれほど違うのかという感じである。 AVIFはAOMという「オープンで中立的な組織」によって、「優れた動画フォーマットを転用して、よりよい静止画形式を提供するために」作られたという名目であるために、非常に受け入れられやすかった。

加えて、AV1に力を入れているNetflixが、正式策定前からサムネイルにAVIFを採用。

結果

  • Chromium - 2020-08 (v85)
  • Firefox - 2021-10 (v93)
  • WebKit - 2021-03
  • Safari - 2022-10 (iOS 16/MacOS 13 Ventura)
  • Edge - 未対応 (2019-03登場のAV1 Media Extensionで対応)

と速やかに対応されることになった。 Firefoxが少し遅いのは、技術的問題により延期されたため。WebKitが対応されてからSafariの対応まで時間があったのは、Safariは画像処理をWebKit内でやっていないためだ。

AVIFはアルファチャンネル, 可逆/非可逆圧縮, アニメーションに対応。 レイヤー機能もあり、ラスター画像に求められる要素を網羅したものになっている。 ただ、色に関してはもともと動画フォーマットということもあってか、YCbCrだけなので印刷入稿には向かない。

AVIFの可逆圧縮は非常に素晴らしく、巨大なJPEG画像を、視覚的には劣化を感じさせないクオリティで圧縮することができる。 一方、可逆圧縮は微妙で、PNGからの圧縮は「少し小さくなる」程度。WebPのほうが大幅に小さくなる。

Web上でのWebPとAVIF

web上では配送先の事情というものがあるため、手元のフォーマット選択とは少し変わってくる。

基本的には「WebPには対応しているがAVIFには対応していない」という状況が、ブラウザにおいて2年程度しかなかったため、「WebPを選択するくらいならAVIFを使えばいい」という感じがある。 アクセシビリティを重視するのであれば、PNGやJPEGで配信すべきで、WebPも使うべきではない。

また、単純に悪感情を持たれているWebPと、「なんか知らない最新の形式」扱いされているAVIFということもあって、AVIFにアドバンテージがあるようには感じられる。

Fediverse上のWebPとAVIF

Fediverseマイクロブログの中で投稿することを想定すると、両者を比較した場合WebPのほうが良い。

Misskeyは設定もあり複雑だが、基本的には投稿された時点でWebPに変換し、WebPで配信するため、ユーザーが意識することはない。

それ以外に関しては、WebPは古いバージョンのインスタンスで見られないくらいだが、AVIFに関しては最新のMastodonでも見られないほか、Pleroma/Akkomaもリモートから来たものは見られない。 このため、「WebPはだいたい見られるがAVIFはほとんど見えない」となり、WebPのほうが良い。

最後にひとこと

出だしのゴタゴタからケチがついて感じがあるが、ソースごとにちゃんとパラメータ調整する前提ではあるものの、今になってみればWebPも悪くない。