Chrome 156 今天正式把 JPEG XL 送进了 Stable：透明通道、HDR、渐进式渲染——一张图看懂和 AVIF 的取舍

写前端的人都踩过这个坑：做一套深色模式要同时维护 PNG + WebP 两种格式，图标还要单独导出带透明通道的 PNG——GIF 太糊，WebP 质量不够，PNG 文件太大，JPEG 不支持透明。今天 Chrome 156 把 JPEG XL 设为了默认支持，一张格式同时解决三个问题。

Chrome 156 在 2026 年 10 月 6 日正式宣布 JPEG XL 稳定支持（Shipping JPEG XL in Chrome，Luca Versari / Moritz Firsching / Philip Jagenstedt，Chrome for Developers Blog）。这不是新特性，而是默认开启——在此之前需要手动开实验 flag，现在所有用户开箱即用。

JPEG XL 能做什么

透明通道：替代 PNG

PNG 的最大存在理由是透明通道，但同质量的 PNG 体积是 JPEG 的 5~10 倍。JPEG XL 内建透明通道（alpha channel），同样一张 512×512 的图标：

• PNG（8bit RGBA，质量 90）：约 28 KB
• WebP（有损，质量 90）：约 12 KB
• JPEG XL（质量 90）：约 7 KB
• JPEG XL（无损，D1）：约 9 KB

同等质量下 JPEG XL 体积减少 60%+，同时支持透明通道。

HDR 支持：超过 8bit 颜色

JPEG 只支持 8bit/通道（1600 万色），JPEG XL 支持最高 32bit/通道。摄影作品、设计稿、对颜色精度有要求的内容，JPEG XL 可以保留全部颜色信息，不再因为颜色深度的硬限制产生色带（banding）。

渐进式渲染：边下边看

传统 JPEG 的显示顺序是自上而下扫完最后一行才能看到完整图片。JPEG XL 支持渐进式渲染（progressive decoding）——下载 10% 的字节就能看到图片主体轮廓，下载 30% 就能看清主体，完整下载后才呈现全部细节。用户感知加载时间大幅缩短，特别适合移动端弱网场景。

无损 JPEG 转码：零损失压缩

把已有 JPEG 图片批量转成 JPEG XL，无需重新编辑原始图，只需一行命令：

Google 内部测试集（WebP 团队对比测试）：JPEG → JPEG XL 转码后，文件体积平均减少 22%，视觉质量完全一致。

JPEG XL vs AVIF：怎么选

这是最常见的选型问题。两者都是现代图片格式，但不是替代关系，而是互补：

实战写法： 多格式 fallback

所有支持 JPEG XL 的浏览器会优先使用 ，不支持时按顺序 fallback 到 AVIF → WebP → JPEG。渐进式渲染、透明通道、HDR 特性由浏览器原生处理，前端无需额外 JS。

浏览器支持现状

• Chrome：156+（2026-10）默认开启
• Firefox：158 Beta（2026-09-28），稳定版 158 预计 2026-10-13，默认开启
• Safari：17+（2026 年初）部分支持，进度条格式
• Edge：跟随 Chromium 156
• CDN 支持：Cloudflare（Automatic Enhanced Image Format）、Akamai、Fastly 均已支持 JPEG XL

三步把 JPEG XL 用起来

第一步：确认哪些图片适合 JPEG XL

打开浏览器 DevTools Network 面板，筛选图片资源。按大小排序，找出 > 50 KB 的 PNG 图标、设计稿、带透明通道的截图——这些场景 JPEG XL 收益最大。

第二步：用 cjxl 批量转换已有图片

第三步：加 标签并测试

把原有 标签替换为 多格式写法。用 Lighthouse 跑一次，确保持续支持旧浏览器无退化。

为什么是现在

2026 年 10 月这个节点有两个变化：第一，Chrome 156 把 JPEG XL 从实验 flag 升级为默认开启，覆盖了 65%+ 的浏览器市场；第二，Firefox 158 稳定版将在 10 月 13 日发布，同步默认开启。两家主流浏览器在同一个月内完成了从「可选」到「默认」的切换，CDN 侧的支持也随之完善。

jxl-rs 是这个决定背后的关键：Google Research 用 Rust 重写了 JPEG XL 解码器，将原来 100,000 行 C++ 的攻击面降为零。Mozilla 在 2022 年时就表达过对内存安全问题的担忧，Rust 重写让这个顾虑彻底打消，也让各家浏览器厂商更愿意默认开启。

JPEG XL 不是要替代 WebP 和 AVIF，而是补全了它们中间的空白：真正无损 + 透明 + 渐进渲染，三合一。今天 Chrome 默认支持了这个格式，前端图片资产可以开始归档了。