三种图像格式正在争夺 JPEG 和 PNG 之后的位置：AVIF、WebP、JPEG XL。它们都承诺在同等画质下提供更小的文件，都拥有真实的浏览器支持，也都至少存在一个明显短板。本文给出实测数字和现实权衡，让你不必再跑一遍基准测试就能选对格式。

速判

压缩最强：AVIF。同等视觉质量下，比 WebP 小约 20%，比 JPEG 小约 50%。
浏览器支持最广：WebP。自 2020 年起普及。
技术设计最佳：JPEG XL。可从 JPEG 无损转码、宽色域、解码无额外开销。被 Google 在 2023 年从 Chrome 中移除支持后陷入停滞。
主视觉用 AVIF，其他场景用 WebP。

压缩数据

Cloudinary、Mozilla、IETF 都对照片类内容做过独立基准。约 5,000 张测试图像得出的共识：

图像之间差异显著 —— JPEG XL 在动态范围大的照片上占优；AVIF 在平面区域与渐变上占优； WebP 在容器开销影响明显的极低码率下扛得住。但排序是稳定的：JPEG XL ≥ AVIF > WebP > JPEG。

如果一半用户看到的是破图标，再好的压缩也没意义。2026 年各格式的现状：

WebP：全球 98% 以上。所有常青浏览器、所有支持图片渲染的现代邮件客户端。例外是较老的企业版 Outlook。
AVIF：全球约 96%。Chrome、Edge、Firefox 自 2021 年起，Safari 自 16（2022 年 9 月）起。老 iOS 与一两款特殊浏览器不解码它。
JPEG XL：全球约 25%。Safari（17 起）。Firefox 在标志位之后。Chrome 在 2023 年以"缺少兴趣"为由移除了支持 —— 一项颇具争议的决定，把采用冻在了原地。没有 Chrome，这个格式无法成为默认。

压缩在运行时不是免费的：

WebP：两端都快。1080p 图像解码 100ms 是常态。
AVIF：编码以慢著称（默认设置下每张数秒）。解码尚可。aom-av1 等现代编码器有所改善，但仍要预期 WebP 的 5–10 倍编码时间。在 CI 中一次转码数千张资源时尤其重要。
JPEG XL：两端与 WebP 大致持平。

WebP 是每通道 8 位、仅 sRGB。对网页足够，对摄影则受限。

AVIF 支持 10 位、12 位、宽色域（Display P3、Rec. 2020）、HDR。这对摄影、设计作品集，以及任何送往色彩管理显示器的图像都是真实的优势。

JPEG XL 走得更远：16 位、可从既有 JPEG 做无损转码（JPEG → JPEG XL → JPEG 来回，无需重新编码）、渐进解码。这是该格式的技术存在感 —— 它是 JPEG 能力的严格超集。

动画：AVIF 支持（AV1 视频编解码器的扩展），WebP 支持。JPEG XL 也支持，但还没有浏览器交付动画 JPEG XL 的解码器。

品牌关键的主视觉：先发 AVIF，WebP 兜底，JPEG/PNG 作为最后退路。使用 <picture>。在 200KB 的素材上节省 20% = 每次页面浏览少 40KB。
普通网站图像：WebP。编解码故事更简单，工具链更成熟，对 JPEG/PNG 的节省已经足够实在。
摄影作品集：AVIF。宽色域和位深有实际意义，且观众跑现代浏览器。
邮件：仍然是 JPEG/PNG。新格式的邮件客户端覆盖度都不行。
所有想伸手去拿 JPEG XL 的场景：改用 AVIF。当 75% 用户都不能解码时，技术优势就不算优势。

最稳妥的模式是三种全部提供，让浏览器自己挑：

<picture> <source type="image/avif" srcset="hero.avif"> <source type="image/webp" srcset="hero.webp"> <img src="hero.jpg" alt="..."> </picture>

浏览器从上到下扫描，挑出第一个能解码的格式并只下载该变体。在 CI 中产出三份编码变体的开销确实存在，但磁盘很便宜，每个素材只需编码一次。

2026 年务实的选择是 主视觉用 AVIF，其余用 WebP，JPEG/PNG 作为兜底。JPEG XL 是我们希望胜出的那个格式 —— 在多数指标上比 AVIF 更优 —— 但浏览器不解码的格式就不算格式。请按你自己的支持矩阵选择，而非按基准测试的标题选择。