比较AVIF和WebP文件大小在相同的DSSIM

我想提高博客上的图像质量,同时保持较小的文件大小。为此,我想提高我的WebP图像的视觉质量,探索新的AVIF图像格式。以下是我通过比较WebP和AVIF和jpeg在相同的视觉质量下的发现。

这篇文章很大程度上受到了作者以前工作的启发约翰内斯SiipolaGilles等级。但是,我将使用更高的目标质量设置和一个包含600张照片和来自博客的图片的图像集。每幅图像将被编码为6个大小的16:9长宽比,宽度从96px到1080px不等。这也是一个很多公平的比较我之前的工作

如果您不关心方法和细节,您可以跳到下面结论和漂亮的图表。你不会明白你在看什么,但这是你的召唤。

我总是在固定的质量设置下以有损格式编码图像。这种方法可能会导致一些图像的视觉质量较低和伪影。它还会产生一些不必要的大文件,而低质量设置本来可以产生足够好的视觉质量的图像。在大多数图像编码库中,质量设置对编码器来说只是一个提示。它不提供任何保证的质量的结果图像。

得到客观、可比指标来比较不同的图像格式,我使用了结构不同以Kornel Lesiń滑雪的dssim图书馆。简单地说,它度量了与源图像的不同程度。这使得不同的编码器可以做出不同的决定,如何牺牲图像质量来实现更小的文件大小,但在类似的“质量预算损失”。

我使用了一个二分搜索算法来根据多次编码尝试为每张图像选择图像质量设置。搜索将选择最接近目标的图像,DSSIM值为0.0025。DSSIM值本身并不意味着任何东西;这不是不同的百分比。零意味着无损,数值越小,差异越小,范围趋于无穷大。

源图像被缩小到所需的大小,并作为无损PNG图像馈入编码器。我启用了所有花费更多处理器时间的设置,以换取更小的文件和更高的质量。编码器被留在他们的默认设置-除非下面另有规定。

的图像格式

在这个测试中,我使用MozJPEG对JPEG图像进行编码。我以前使用过Guetzli编码器,并无损地重新打包结果到逐步jpeg使用MozJPEG。Guetzli比MozJPEG生成更小的图像,但是它需要更多的处理时间。在这个比较中(或在我的任何项目中)使用它是不可行的,因为我希望对每张图像编码最多6次。默认情况下,MozJPEG还会生成渐进式jpeg,从而消除了图像处理链中的一个步骤。

在比较中,最低的JPEG质量是50,最高的99,在0-100的范围内的平均值是84(越高表示越好)。提醒一下:与高质量的源图像相比,这些图像都具有相同的DSSIM值。我发现这个范围产生的图像在一个可接受的视觉质量损失绝对迷人。我手动重新编码的一些图像降落在一个低质量设置在较高的平均质量设置。这些图像的大小几乎是原来的两倍,但得到的DSSIM值几乎相同。

我用(cavif(建立在(libavif)来编码AVIF图像。AVIF是一种基于开源AV1视频编解码器的新开放图像格式。图像编码与YUV 444彩色子采样,以更接近WebP锋利的YUV420二次抽样。libavif没有选项等于libwebp但是更高的子抽样可以获得类似的——好吧,实际上更好的——结果。通过分析图像并根据需要动态切换422或444颜色子采样,可以进一步减小图像文件的大小。预计未来版本的Mozilla Firefox和谷歌Chrome及其衍生产品将支持AVIF。

在64-0的评分中,最低的AVIF质量是33,最高的0分,平均为12分(越低表示越好)。

我包含的最后一种格式是WebP。如前所述,我使用了libwebp与夏普YUV选项启用。如前一篇文章中所讨论的,只能选择可以忽略的影响图像文件的大小。WebP已经有10年的历史了,而Safari 14将是最后一个获得WebP图像格式支持的主流web浏览器。Safari 14将于2020年第三季度发布,适用于macOS和iOS系统。

最低的WebP质量是55,最高的99,在0-100的评分中平均为93(越高表示越好)。我惊讶地得知,WebP图像需要更高的质量设置来匹配MozJPEG的视觉质量。除了两张图片外,所有的WebP图片都采用了比JPEG更高质量的设置。我一直误以为WebP的质量设置接近JPEG的质量设置。

结果

与参考JPEG进行比较;WebP的文件大小的中位数减少了31,5%,第85百分位数减少了20%,并且有2,7%的图像变大了。

AVIF图像的文件大小中位数减少了50,3%,第85百分位数减少了39,6%,并且所有图像都没有比参考文献大。

下面的小yabo亚博体育下载提琴图显示了每种格式相对于JPEG参考图像的文件大小缩减为0的分布。(越高表示文件大小越小。)

小提琴图形的文件大小的WebP和AVIF vs JPEG。WebP几乎总是比JPEG小,但AVIF始终比WebP保存更多。

图像文件大小节省在WebP和AVIF相比,参考JPEG在相同的DSSIM。

AVIF在测试中的表现优于JPEG和WebP。AVIF的第85个百分位数和WebP的第15个百分位数相同!一个中间节省- 50%在相同的DSSIM是一个非常好的结果!使用AVIF几乎可以保证节省带宽,但在使用WebP时必须检查每个映像。

没有AVIF或WebP支持渐进图像解码;这是一种技术,可以给连通性差的人提供更好的用户体验。然而,AVIF相当小的文件大小有助于减轻对渐进解码的需要。

我决定继续为Ctrl blog推出有损图像的AVIF。HTML的元素可以处理多种图像格式,作为支持新格式的web浏览器的渐进增强。AVIF预计将在今年晚些时候登陆谷歌Chrome 85和Mozilla Firefox。

您可以在Firefox version 77及更新版本中启用对它的实验性支持:配置和切换image.avif.enabled。我想我们还要再过十年才能看到AVIF在苹果平台上的支持?