格式对比
AVIF 对比 WebP：你该用哪种新一代图片格式？
AVIF 和 WebP 都以可观的幅度胜过 JPEG 和 PNG，但它们在压缩与速度的取舍上有所不同。AVIF 的压缩比 JPEG 好上多达 50%；WebP 大约好 25% 到 35%，而编码要快得多。对于你能掌控的网页，AVIF 值得为之等待编码；而对于交付速度比每一千字节都更重要的场景，WebP 才是务实之选。
WebP 最擅长什么
WebP 由 Google 设计，作为 JPEG 和 PNG 在网页上的即插即用升级。在相同视觉质量下，它生成的文件大约比 JPEG 小 25% 到 35%，支持透明和动画，并且自 2020 年起就被所有主流浏览器支持。它的编码很快：一批照片几秒钟就能转换为 WebP。扎实的压缩、广泛的支持加上快速的编码，这种组合让 WebP 成为如今网页图片稳妥的默认选择。
AVIF 最擅长什么
AVIF 基于 AV1 视频编解码器，在相同视觉质量下，其压缩通常比 JPEG 好 50%，也明显优于 WebP。它处理平滑渐变和精细细节也比 WebP 更干净，在有损格式中出现于高对比边缘周围的振铃伪影更少。自 2023 年底起，浏览器支持已覆盖所有主流浏览器。真正的代价是编码时间：WebP 只需几秒，AVIF 却要几分钟，因此它最适合那些压缩一次、却被反复分发的图片，比如主视觉大图和产品照片。
如何选择，并在你的浏览器里测试两者
务实的做法是用你自己的图片把两者都试一遍，再对比结果。把同一张照片拖入图片压缩器，分别导出为 WebP 和 AVIF，然后把文件大小和视觉质量并排对比。压缩器完全在你的浏览器中运行：你的文件永远不会离开你的设备。对于每一千字节都会影响页面速度评分的网站主视觉大图或产品图库，AVIF 值得多花那点编码时间。对于需要快速处理大量图片的用户上传内容，WebP 才是合适的取舍。
本指南用到的工具
常见问题
我可以在没有 WebP 兜底的情况下使用 AVIF 吗？
对于面向现代浏览器的新网页，可以。截至 2023 年底，Chrome、Firefox、Safari 和 Edge 都支持 AVIF，这覆盖了绝大多数网页流量。如果你的受众包含较旧的浏览器或某些你无法核实的移动端 webview，那么在 picture 元素里提供一个 WebP 兜底就是稳妥的做法：浏览器会选用它支持的第一个格式，忽略其余的。
透明图片应该用哪种格式？
两者都支持透明。在相同质量下，AVIF 处理透明时的压缩略优于 WebP。如果这张透明图片是出现在许多页面上的徽标或界面元素，AVIF 能省下相当可观的字节数。如果编码速度是一项约束，那么 WebP 透明也是一个出色的结果，是批量处理时的务实之选。