AVIF形式全解读：下一代画像圧縮標準

結論先行：AVIF 是基于 AV1 動画エンコード的下一代画像形式，比 JPEG 小 50%、比 WebP 小 20%，同时サポート无损圧縮、HDR、宽色域和透明通道。以一张 1920×1080 照片である例，JPEG 品質 85 约 420KB，AVIF 同等画質仅 210KB。AVIF 采用 AV1 フレーム内エンコード技術（分区预测+变换エンコード+环路滤波），圧縮効率远超 JPEG 的 DCT。截至 2026 年，Chrome、Firefox、Safari、Edge 均已原生サポート AVIF，全球浏览器覆盖率约 96%。以下では技術原理から説明し，に出四形式实测比較和迁移指南。

もし Web 画像形式比較まだ慣れていない場合は，まずWebP vs PNG vs JPG：Web 画像形式怎么选？。

一、AVIF是什么

AVIF（AV1 Image File Format）是开放媒体联盟（AOMedia）于 2019 年发布的画像形式，基于 AV1 動画エンコーダー的フレーム内エンコード技術。AV1 本身是である下一代動画（8K/120fps）设计的开源エンコード標準，免授权费，其フレーム内エンコードツール同样適用于静态图像圧縮。AVIF である是を AV1 的フレーム内エンコード封装である独立的画像容器形式。

特性	AVIF	WebP	JPEG	PNG
发布年部	2019	2010	1992	1996
底层エンコード	AV1フレーム内	VP8フレーム内	DCT	DEFLATE
有损圧縮	サポート	サポート	サポート	不サポート
无损圧縮	サポート	サポート	不サポート	サポート
透明通道	サポート	サポート	不サポート	サポート
HDR/宽色域	サポート(12位)	不サポート(8位)	不サポート(8位)	不サポート(8/16位)
动画サポート	サポート	サポート	不サポート	APNG扩展
授权费	免费开源	免费开源	免费	免费

AVIF 相比上一代 WebP 的核心进步在于：サポート 12 位色深和 HDR（高动态範囲），WebP 仅サポート 8 位 SDR；圧縮率更高（同等画質小 10%–30%）；サポート更丰富的エンコードツール（方向性预测、ブロック分割更灵活）。代价是エンコード速度较慢——AVIF エンコード耗时约である WebP 的 3–5 倍。

二、AVIF技術原理詳解

AVIF 的圧縮流水线分三つ核心阶段：分区预测、变换エンコード、环路滤波。每つ阶段都继承了 AV1 動画エンコード的先进ツール，この是 AVIF 圧縮効率远超 JPEG 的根本原因。

1. 分区预测

AV1 を图像划分であるエンコードブロック（最大 128×128），每つブロック可以递归细分である更小的子ブロック（最小 4×4），根据图像コンテンツ自适应選択分区方式。预测エンコード用已重建的ピクセル预测当前ブロック，只エンコード残差（实际值与预测值的差异）。

预测タイプ	原理	適用区域	vs JPEG
フレーム内预测	用相邻已エンコードピクセル预测	平滑区域/渐变	JPEG无预测，全量エンコード
方向性预测	56種類方向角度预测	边缘/纹理方向	JPEG无方向预测
调色板预测	用颜色调色板索引	文字/图标/动画	JPEG无此ツール
ブロック复制	复制图像内其他区域	重复纹理	JPEG无此ツール

2. 变换エンコード

预测后的残差用变换エンコードから空間域转到频域，量化高频系数実現圧縮。AV1 サポート多種類变换タイプ，比 JPEG 的单一 DCT 更灵活。

变换タイプ	ブロック大小	適用シナリオ	优势
DCT	4×4到64×64	通用	经典变换，能量集中
ADST(非に対して称离散正弦变换)	4×4到32×32	方向性边缘	に対して边缘残差更优
恒等变换	4×4到32×32	无损/低损	跳过变换，直接量化
递归变换	グループ合	複雑纹理	2级变换向上能量集中

3. 环路滤波

量化后的重建图像会产生ブロック效应和振铃效应，AV1 用多级环路滤波修复この些伪影。この是 AVIF 在低ビットレート下画質明显优于 JPEG 的重要。

滤波阶段	作用	処理顺序	効果
CDEF(方向性去ブロック滤波)	去除ブロック边界伪影	第1级	平滑ブロック边界
LR(环路恢复滤波)	维纳滤波/自引导滤波	第2级	恢复詳細纹理
超解像度重建	から低解像度フレーム重建	第3级	向上高频詳細

について画像圧縮的整体ソリューション，を参照してください画像圧縮指南：JPG/PNG/WebP 形式比較。

三、実戦案例：四形式实测比較

用同一张テスト画像比較 AVIF、WebP、JPEG、PNG 四種類形式的サイズ、画質和エンコード耗时。テスト样本：1920×1080 自然风景照片，24 位真彩色，元 BMP 约 5.93MB。

ドキュメント特徴： 1920×1080，24位彩色，含天空渐变、树叶纹理、建筑边缘，元 BMP 5.93MB。

サイズ与画質比較（目標 SSIM 0.92）：

形式	パラメータ	ファイルサイズ	vs元	SSIM画質	vs JPEG
PNG(无损)	DEFLATE最高	4.82MB	-18.7%	1.000	+938%
JPEG	品質85	420KB	-92.9%	0.921	基准
WebP	品質80	298KB	-95.0%	0.923	-29.0%
AVIF	品質55(CRF)	210KB	-96.5%	0.925	-50.0%

結果： 在同等画質（SSIM 0.92+）下，AVIF 仅 210KB，比 JPEG 小 50%，比 WebP 小 29.5%。PNG 无损画質最高但サイズ最大（4.82MB），不適した照片类コンテンツ。AVIF 在树叶纹理和天空渐变区域表现尤其突出——JPEG 在低ビットレート下会出现明显色ブロック，AVIF 几乎无可见伪影。

エンコード耗时比較：

形式	エンコード耗时	デコード耗时	速度评价	適用シナリオ
JPEG	18ms	8ms	极快	实时エンコード
WebP	65ms	15ms	快	Web实时
AVIF	280ms	22ms	慢(エンコード)/快(デコード)	预生成
PNG	120ms	12ms	中	无损シナリオ

AVIF 的エンコード耗时是 JPEG 的 15 倍、WebP 的 4 倍，この是因である AV1 的分区预测和变换選択需要大量率失真最適化計算。但 AVIF 的デコード速度仅比 JPEG 慢 2 倍——浏览端体验影响很小。推奨 AVIF 画像在サービス端预生成（构建时エンコード），而非实时エンコード。

四、浏览器互換性与迁移戦略

AVIF 的浏览器互換性在 2023 年后已基本成熟，但仍需である旧浏览器提供回退ソリューション。下表列出主流浏览器的サポート情况。

浏览器	サポート版本	发布時間	全球占比	サポート状态
Chrome	85+	2020年9月	65%	原生サポート
Safari	16.4+	2023年3月	18%	原生サポート
Edge	92+	2021年	5%	原生サポート
Firefox	93+	2021年10月	3%	原生サポート
Opera	71+	2020年	2%	原生サポート
IE	不サポート	—	<1%	需回退

全球浏览器に対して AVIF 的サポート率约 96%，不サポート的仅剩 IE 和极旧版本的浏览器。迁移戦略推奨用 HTML5 的 picture 标签実現渐进增强。

迁移ソリューション	実現方式	互換性	维护コスト	推奨度
picture标签	source多形式+img回退	100%	低	★★★★★
仅AVIF	直接用avif	96%	极低	★★★☆☆
Accept头协商	サービス端按Accept返回	100%	中	★★★★☆
仅JPEG	不迁移	100%	极低	★☆☆☆☆

推奨的 picture 标签写法：

<picture><source srcset="photo.avif" type="image/avif"><source srcset="photo.webp" type="image/webp"><img src="photo.jpg" alt="风景照"></picture>

浏览器会按优先级選択第一つサポート的形式：サポート AVIF である用 AVIF（最小），否则尝试 WebP，最后回退 JPEG。この样既享受 AVIF 的圧縮优势，又保证旧浏览器正常表示。について Web 画像最適化的完整ソリューション，を参照してくださいWeb 画像最適化：性能向上 50% 実戦。

五、不同シナリオ的形式选型推奨

AVIF 虽好但不是所有シナリオ都適した，不同シナリオ的画像形式选型需要综合考虑圧縮率、互換性、エンコード速度和機能要件。

シナリオ	推奨形式	理由	サイズ参照
电商商品图	AVIF(主)+JPEG(回退)	追求极致サイズ，向上読み込み速度	JPEG 420KB→AVIF 210KB
新闻资讯	WebP(主)+JPEG(回退)	エンコード快，互換性好	JPEG 420KB→WebP 298KB
HDR摄影	AVIF	唯一サポート12位HDR的主流形式	无损HDR仅AVIF可选
UI图标/截图	PNG	无损要求，边缘锐利	不影响サイズ
社交媒体	AVIF或WebP	サイズ小，分享快	2種類均可
邮件嵌入	JPEG	邮件客户端互換性优先	不推奨AVIF(兼容差)
動画封面	AVIF	AV1動画天然配套	比JPEG小50%
实时生成(検証码等)	JPEG	エンコード速度优先	18ms vs AVIF 280ms

一般的的な原則：静态コンテンツ预生成选 AVIF（サイズ最优），实时生成选 JPEG/WebP（速度优先），无损要求选 PNG，HDR コンテンツ选 AVIF（唯一選択）。用SmartSlim バッチ量変換时可自動生成多形式（AVIF+WebP+JPEG），一次処理覆盖所有兼容シナリオ。

五、よくある質問FAQ

Q1：AVIF是什么形式？

AVIF（AV1 Image File Format）是基于 AV1 動画エンコード的画像形式，由开放媒体联盟（AOMedia）于 2019 年发布。AVIF 利用 AV1 的フレーム内エンコード技術圧縮静态图像，比 JPEG 小 50%、比 WebP 小 20%，同时サポート无损圧縮、HDR、宽色域和透明通道。AVIF 是开源免授权费的下一代画像圧縮標準，已被 Chrome、Firefox 等主流浏览器原生サポート。

Q2：AVIF比JPEG小多少？

在同等画質（SSIM 0.9 以上）下，AVIF 比 JPEG 小约 50%。例如一张 1920×1080 照片：JPEG 品質 85 约 420KB，AVIF 同等画質约 210KB。比較 WebP，AVIF 在中等画質下小约 20%，在高画質下优势更明显（小 30% 以上）。AVIF 的圧縮优势来自 AV1 更先进的预测エンコード和变换ツール，尤其在纹理複雑区域表现突出。

Q3：AVIF浏览器互換性怎么样？

截至 2026 年，AVIF 已获主流浏览器サポート：Chrome 85+（2020 年 9 月）、Firefox 93+（2021 年 10 月）、Edge 92+（2021 年）、Safari 16.4+（2023 年 3 月）。全球浏览器サポート率约 96%。不サポート的旧浏览器可を通じて picture 标签提供 JPEG/WebP 回退。推奨用 <picture><source srcset='img.avif' type='image/avif'><img src='img.jpg'></picture> 実現渐进增强。

Q4：AVIF和WebP哪つ更好？

综合来看 AVIF 优于 WebP。圧縮率：AVIF 比 WebP 小 10%–30%；機能：AVIF サポート HDR 和 12 位色深，WebP 仅サポート 8 位 SDR；エンコード速度：WebP 快于 AVIF（AVIF エンコード较慢）；互換性：WebP サポート率约 98%，AVIF 约 96%。如果追求极致圧縮率和 HDR サポート选 AVIF，如果追求エンコード速度和广泛兼容选 WebP。推奨用 picture 标签同时提供2種類形式。

まとめ

AVIF 是下一代画像圧縮標準，基于 AV1 フレーム内エンコード，比 JPEG 小 50%、比 WebP 小 20%，またサポート HDR、12 位色深和透明通道。技術上的领先来自分区预测（56 種類方向预测）、多種類变换エンコード（DCT/ADST/恒等变换）和多级环路滤波（CDEF+LR）。代价是エンコード速度较慢（约である WebP 的 4 倍），適した预生成シナリオ而非实时エンコード。

迁移戦略推奨 picture 标签多形式ソリューション：AVIF 优先、WebP 次选、JPEG 回退，兼顾圧縮率和 100% 互換性。覚えておくべき3つのポイント：一是 AVIF エンコード慢但デコード快，適したサービス端预生成；二是 HDR コンテンツ只有 AVIF 可选（WebP/JPEG 不サポート）；三是用 picture 标签同时提供三種類形式，させる浏览器自動选最优。