banner
夜光LOEN

夜光LOEN

👨🏻‍💻热爱开源的前端小菜鸟 | 🆓喜欢开源和白嫖 | 🐋喜欢摸鱼

AVIF-次世代の画像形式の使用体験

ある日、Bilibili のサムネイルを保存していると、実際には avif という拡張子で保存されていることに気づき、私の好奇心が引かれました。通常、ウェブサイトのサムネイルは通常 webp 形式ですが、なぜ Bilibili がこの形式を使用しているのか、この形式にはどのような利点があるのか気になりました。そこで、私は体験してみることにしました。私は画像処理の専門家ではなく、ただのアマチュアのデザイナーですので、私の体験は非常に限定的なものです。皆さんはただのお楽しみとしてご覧ください。

紹介#

この紹介は Wikipedia から引用されています。リンク先はhttps://zh.wikipedia.org/wiki/AVIFです。

AV1イメージファイル形式(AV1 Image File Format、略称 AVIF)は、AOMedia Video 1のビデオコーデック技術を使用して画像を圧縮するための画像ファイル形式であり、Open Media Allianceによって開発されました。AVIF は一般的な画像や動画を保存するために使用されます。AVIF とAppleの製品で使用されているHEIC(High-Efficiency Image Container)画像形式は、国際標準化機構基本メディアファイル形式高効率画像ファイル形式(High Efficiency Image File Format、略称 HEIF)コンテナを採用していますが、HEIC はHEVC/H.265からの圧縮技術を使用しています。

Netflix の 2020 年のいくつかのテストでは、AVIF は JPEG よりも優れた圧縮効率を示し、より豊かな詳細を保存し、ブロック効果がほとんどなく、はっきりとした輪郭と鮮やかな色彩の自然な画像や素材で色の歪みが少ないことが示されました。

使用体験#

現在、avif 形式をサポートしているウェブサイトやソフトウェアは少ないですが、幸運なことに私の画像ビューアである nomacs はこの形式をサポートしています(このソフトウェアは無料でオープンソースです。ダウンロードリンク:https://nomacs.org/)。また、photodemon はこの形式への変換をサポートしています。以下は 2 つの比較画像です。どちらが avif で、どちらが jpg かを見て、違いを確認してください(正直なところ、私には区別がつきません)。
画像 1

画像 2
さて、答えを明らかにしましょう。右側の画像が avif で、最初の画像の jpg のサイズは 344KB で、avif のサイズはわずか 32.5KB です。また、2 番目の画像の左側の png のサイズは 1.53MB で、avif のサイズはわずか 51.2KB です!本当に驚くべきことです!さらに、同じサイズの体積で比較した avif と webp の比較も行いましたが、avif の方がより鮮明であることがわかりました。以下の図をご覧ください。
画像 3

利点と欠点#

avif の利点は明らかです。ファイルサイズが小さく、画質が高く、透明な背景をサポートしています。しかし、私が言いたいのは、欠点です。まず第一に、従来の画像形式よりもリソースを消費するということです。開く速度が遅くなります。次に、サポートされているソフトウェアやウェブサイトは非常に限られています。デザイン業界の標準ソフトウェアである PS や figma などのソフトウェアはほとんどサポートしていません(PS はプラグインを使用してサポートすることができます)。また、ウェブページは基本的に webp と jpeg が主流です。実際に avif を使用できる場所はほとんどありません。つまり、ほとんどの人が使用していないということです。これは現時点での最大の欠点です。もちろん、高い EQ を持つ人々は、これは未来の画像形式であると言うでしょう。

雑談#

正直なところ、私は完璧な画像形式が登場することを望んでいます。より広い色域をサポートし、より小さなファイルサイズ、より良い表示効果、より高速なオープン速度、より小さなリソース使用量を実現したいと思っていますが、現時点の avif 形式ではそれは実現できないと思います。なぜなら、そのオープン速度とプレビュー速度は確かに遅くなるからです。しかし、その利点はオープンソースで無料であることです。ただし、webp は Google の支援を受けており、普及が非常に遅いです。avif については言及するまでもありません。したがって、現時点では一般的なファイル形式を使用することが普通です。これはただの遊びです。また、今回の記事で使用したファイル変換ソフトウェアは photodemon です。これも無料でオープンソースの画像処理ソフトウェアで、avif 形式をエクスポートすることができますが、プラグインを別途インストールする必要があります(保存というボタンをクリックするだけでインストールのプロンプトが表示されます)。興味がある方はぜひ試してみてください!

読み込み中...
文章は、創作者によって署名され、ブロックチェーンに安全に保存されています。