减少图像下载大小

原文: https://developer.android.com/topic/performance/network-xfer.html

大多数下载流量由图像组成。因此,您可以制作可下载图片的尺寸越小,您的应用可以为用户提供的网络体验就越好。本页面提供了使图像文件变得更小,更加网络友好的指导。

了解图像格式


Android应用程序通常使用以下一种或多种文件格式的图像:PNG,JPG和WebP。对于这些格式中的每一种,都可以采取一些步骤来减小图像大小。

PNG

缩小PNG文件的一个关键是减少构成图像的每行像素中使用的唯一颜色的数量。通过使用较少的颜色,可以提高管道其他所有阶段的压缩潜力。

减少独特颜色的数量会产生显着的差异,因为PNG压缩效果部分是水平相邻像素颜色变化程度的函数。因此,减少每行PNG图像中唯一颜色的数量可以帮助减少文件大小。

在决定是否采取这种策略时,应该记住,减少唯一颜色的数量有效地等同于对图像应用有损编码阶段。然而,一个编码工具可能并不能很好地判断一个看起来很小的错误对人眼的看法有多糟糕。因此,您应该手动执行此项工作,以帮助确保高效压缩和可接受图像质量之间的正确平衡。

您可以采取两种特别有用的方法:争取索引格式,并应用矢量量化。

争取索引格式

任何尝试减少颜色的尝试都应该先尝试优化颜色,以便在将图像作为PNG导出时使用INDEXED格式。INDEXED颜色模式的工作原理是选择最佳的256种颜色,并将所有像素值与索引替换为该颜色调色板。其结果是从16000000(潜在的)颜色的减少为仅256色:从3(不透明度)或4(具有透明度)每像素字节每像素1个字节。这一改变是文件大小缩减的重要步骤。

图1显示了一个图像及其索引变体。

图1.转换为INDEXED格式之前和之后的图像

图2显示了图1中图像的调色板:

图2.图1中图像的调色板

将图像表示为调色板图像大大改善了文件大小,因此值得研究大多数图像是否可以转换。

当然,不是每个图像都可以用256色精确表示。例如,某些图像可能需要257,310,512或912种颜色才能正确显示。在这种情况下,矢量量化也是有帮助的。

矢量量化

创建索引图像的过程可以更好地描述为矢量量化(VQ)。VQ是多维数字的舍入过程。在这个过程中,图像中的所有颜色将根据其相似性进行分组。对于给定的组,该组中的所有颜色都被单个中心点替换,从而最大限度地减少该单元格中的颜色错误(如果使用Voronoi术语,则为“站点”)。在图3中,绿点代表输入颜色,红点代表输入颜色的中心点。每个单元格都以蓝线为界。

图3.将矢量量化应用于图像中的颜色。

将VQ应用于图像的结果减少了独特颜色的数量,用视觉质量“非常接近”的单一颜色来代替每组颜色。

这种技术还允许您定义图像中唯一颜色的最大数量。例如,图4显示了一个1670万色(每像素24位,或bpp)的鹦鹉头,以及仅允许使用16(3 bpp)唯一颜色的版本。

图4.应用矢量量化之前和之后的图像。

马上,你可以看到有一个质量损失,大部分的渐变颜色已经被替换,给图像赋予了条纹效果。这个图像需要超过16种独特的颜色。

在流水线中设置VQ步骤可帮助您更好地了解图像使用的独特颜色的真实数量,并可帮助您显着减少这些颜色。有很多现成的工具可以用来帮助你实现这个技术。

JPG

如果您使用的是JPG图像,则可以进行一些小的更改,从而可以节省大量文件。这些包括:

  • 通过不同的编码方法生成较小的文件大小(不影响质量)。
  • 略微调整质量以产生更好的压缩。

追求这些策略往往可以净化你的文件大小减少高达25%。

在选择工具时,请记住,照片导出工具可以将不必要的元数据(如GPS信息)插入到图像中。至少,尝试利用现有的工具来帮助从您的文件中去除这些信息。

WebP的

WebP是Android 4.2.1(API级别17)支持的更新的图像格式。这种格式为网络上的图像提供了优越的无损和有损压缩。使用WebP,开发人员可以创建更小,更丰富的图像。WebP无损图像文件平均 比PNG 小26%这些图像文件还支持透明度(也称为Alpha通道),其代价是多了 22%的字节。

在相同的SSIM 质量指数下, WebP有损图像 比可比较的JPG图像 小25-34%对于有损RGB压缩可接受的情况,有损WebP也支持透明度,通常产生比PNG小3倍的文件大小。

有关WebP的更多信息,请访问 WebP网站

您可以使用Android Studio将现有的BMP,JPG,PNG或静态GIF图像转换为WebP格式。有关更多信息,请参阅使用Android Studio创建WebP图像

选择格式


不同的图像格式适用于不同类型的图像。JPG和PNG有不同的压缩过程,并产生不同的结果。

PNG和JPG之间的决定往往归结为图像本身的复杂性。图5显示了两个图像,根据开发人员应用哪种压缩方案,出现的截然不同。左边的图片有许多小的细节,因此用JPG更有效地压缩。右边的图像以相同的颜色运行,使用PNG更有效地压缩。

图5.适用于JPG与PNG的情况

WebP作为一种格式可以同时支持有损和无损模式,使其成为PNG和JPG的理想替代品。唯一要记住的是,它只在运行Android 4.2.1(API级别17)或更高版本的设备上具有本机支持。幸运的是, 大多数设备都满足这个要求。

图6提供了一个简单的可视化来帮助您决定使用哪种压缩方案。

图6.决定压缩方案

确定最佳质量值


您可以使用几种技术来实现压缩和图像质量之间的正确平衡。一种技术使用标量值,因此只适用于JPG和WebP。另一种技术利用了Butteraugli库,可用于所有图像格式。

标量值(仅适用于JPG和WebP)

JPG和WebP的强大之处在于您可以使用标量值来平衡质量和文件大小。诀窍是要找出图像的正确质量值。如果质量水平太低,则会以图像质量为代价生成一个小文件。过高的质量水平会增加文件大小,而不会为用户带来明显的好处。

最直接的解决方案是选择一些非最大值,并使用该值。但是请注意,质量值会以不同的方式影响每个图像。例如,75%的质量在大多数图像上可能看起来不错,但有些情况下也可能不好。您应该确保根据具有代表性的图像样本测试您选择的最大值。此外,请确保对原始图像执行所有测试,而不是压缩版本。

对于每天上传和重新发送数百万JPG文件的大型媒体应用程序,手动调整每个资源是不切实际的。根据图像类别,您可以通过指定几个不同的质量级别来应对这一挑战。例如,您可以将35%设置为缩略图的质量设置,因为较小的图像会隐藏更多的压缩工件。

Butteraugli

Butteraugli项目是一个图像库,用于测试图像的心理视觉错误阈值:观察者开始注意到图像质量下降的时间点。换句话说,这个项目试图量化如何扭曲你的压缩图像。

Butteraugli允许您定义视觉质量的目标,然后运行PNG,JPG,WebP有损和WebP无损压缩。然后,您可以选择文件大小和Butteraugli级别的最佳平衡的图像。图7显示了Butteraugli如何在视觉失真高到足以让用户感觉到问题之前找到最低的JPG质量等级的例子。结果是文件大小减少了大约65%。

图7.应用Butteraugli技术之前和之后的图像

Butteraugli允许您根据输出或输入进行操作。也就是说,您可以在用户感知最终图像中的明显失真之前查找最低质量设置,或者可以迭代设置图像失真水平以了解其关联质量水平。

服务大小


在服务器上保留图像的单个分辨率是很诱人的。当设备访问图像时,服务器以该分辨率提供服务,并将设备的降尺寸缩小。

这个解决方案对于开发者来说是很方便的,但是对于用户来说可能是很痛苦的,因为解决方案迫使用户下载比他们需要更多的数据。您应该改为存储多种尺寸的图像,并提供最适合特定用例的尺寸。例如,对于缩略图,服务实际的缩略图图像而不是服务和缩小全尺寸版本消耗的网络带宽少得多

这种方法对于下载速度是有利的,对于可能使用有限或计量数据计划的用户而言成本较低。像这样进行也会导致图像在设备和主存储器上占用更少的空间。在大图像(例如4K图像)的情况下,这种方法还可以使设备在加载之前不必调整图像大小。

实现这种方法要求您有一个后端映像服务,以适当的缓存提供各种分辨率的图像。现有的服务可以帮助完成这项任务。例如, App Engine附带有已安装的图像大小调整功能。


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值