JPEG XL现在已被所有主流浏览器支持，因此我决定更详细地研究一下与其他格式相比它的优缺点。结论我将详细说明，附上示例和基准测试，但对于没有时间的人，这里是要点：对于网页上的有损照片，AVIF几乎总是生成比JPEG XL更小的文件。在默认努力设置下，最佳的JPEG XL版本通常比相应的AVIF大15%至25%。在最大努力设置下，这一差距会缩小一些，通常为6%至20%。存在一些例外情况，其中JPEG XL接近或甚至超越AVIF，因此如果你希望特定图像获得最佳结果，值得尝试两者。F1图像是一个典型示例，而鼹鼠是一个例外。JPEG XL编码器的效果非常重要。更新的JPEG XL编码器jixel通常生成比libjxl更小的文件，除非图像有详细的透明度。人像图像就是一个例子。对于截图和插图，AVIF显然优于JPEG XL。在默认努力设置下，相当于的JPEG XL要大30%至90%，而在最大努力设置下要大20%至70%。有损AVIF对这些效果很好 - 除非你确实需要逐位精确的结果，否则不需要使用无损格式。请参见截图和插图示例。对于带透明度的图像，AVIF明显优于JPEG XL。在默认努力设置下，libjxl版本大31%至44%，而在最大努力设置下大61%至70%。jixel始终以无损格式编码透明度，这使得它的文件比AVIF大2到3倍。请查看数据。总体而言，AVIF编码速度更快，使用的内存更少，考虑到文件大小。jixel比AVIF更快，并且使用更少的内存，但它的文件通常要大得多，因此从整体上看AVIF更好。F1图像就是一个例子。AVIF的解码速度更快。JPEG XL通常在中等质量下的解码时间比AVIF慢2到3倍，但在非常高的质量下这一差距缩小了，有时Chrome可以更快解码JPEG XL。人像图像就是一个例子。对AVIF和jixel来说，更高的努力设置是值得的，而libjxl则不然。libjxl的更高努力设置速度更慢，使用的内存更多，对结果的改善几乎没有。在某些情况下，它们生成的文件比默认努力设置更大。截图就是一个例子。AVIF的4:2:0模式（半色彩分辨率）不应该是你的默认模式。它很少减少文件大小，并且会使更高质量的效果难以达到。尽管如此，它的编码和解码速度更快。如果你没有时间检查两者，请坚持使用4:4:4。F1图像是一个示例，截图是一个例外。所有编码器的质量设置都是可靠的。使用单一质量设置时，生成的质量在图像之间有所变化，但所有编码器的变化趋势一致，并且似乎合理。请查看数据。高努力下的渐进式JPEG XL基本上是免费的。jixel最近添加了支持早期渐进预览，在其最慢的设置下，它们几乎没有费用，但在默认设置下文件大了12%。Firefox和Chrome支持渐进式JPEG XL。Safari仍然渲染最终图像，但不显示渐进预览。然而，这种渐进式渲染是否提供良好的用户体验？请查看示例和数据。AVIF支持渐进式渲染！目前仅支持Chrome，但正在为Firefox开发。它比渐进式JPEG XL复杂，但它提供了更多对预览外观的控制，文件通常更小，并且解码速度要快得多。亲自查看。对于HDR，JPEG XL缺少增益映射，这与AVIF相比是一个显著的限制。JPEG XL格式支持增益映射，但浏览器解码器不支持，并且编码故事混乱/实验性。比较未增益映射的HDR内容时，我使用的两个质量指标之间存在很大分歧，但它们一致认为JPEG XL生成的文件比AVIF小。请查看示例。JPEG XL可以将现有JPEG文件缩小9%至20%，而不会进一步损失。它的解码速度也与AVIF相当，或更快，除了小图像。请查看数据。对于无损来说，JPEG XL显然是赢家。无损WebP在照片上大9%至17%，而无损AVIF则大30%至120%。但无损图像几乎从不适合网络使用。如果你在网上使用它们（就像我在这个页面上做的），要留意jixel的更高努力 - 它通常生成的文件解码速度过慢。请查看数据。动态图像格式仍然是一个愚蠢的主意。请不要使用它们。如果必须，了解更多信息。对于网页使用案例，我目前的默认选择为AVIF 4:4:4，努力级别尽可能高。如果我感觉AVIF生成的文件尤其大，我会检查一下通过jixel的JPEG XL，看它是否表现更好。最近，无论是AVIF还是JPEG XL（通过jixel）都有了巨大的改进，因此未来这一推荐可能会改变。