1

https://developers.google.com/speed/docs/insights/OptimizeImages上的文档有一条已弃用的警告消息。

更新文档的链接不包含有关推荐转换命令的详细信息。

Google Pagespeed Insights 更新版本的优化要求是否有任何变化?

convert INPUT.gif_or_png -strip [-resize WxH] [-alpha Remove] OUTPUT.png
convert cuppa.png -strip cuppa_converted.png

convert INPUT.jpg -sampling-factor 4:2:0 -strip [-resize WxH] [-quality N] [-interlace JPEG] [-colorspace Gray/sRGB] OUTPUT.jpg
convert puzzle.jpg -sampling-factor 4:2:0 -strip -quality 85 -interlace JPEG -colorspace sRGB puzzle_converted.jpg

我还检查了 Pagespeed Insights API 的 Github 页面中的示例,但没有提到优化图像。

4

1 回答 1

1

简答

如果是 jpg,图像必须至少有 85% 的压缩率。对于 PNG,如果不透明,请删除 alpha 通道。您还应该使用优化工具(例如tinypng for pngs)来尽可能多地删除重量(尽管 Lighthouse 不会报告这一点)

长答案

该指南已替换为两个不同的文档(据我所知)

https://web.dev/uses-optimized-images/

https://web.dev/uses-webp-images/

第一个文件是主要文件。

所有这些指导基本上都是在说“不要通过网络发送比需要更多的信息”。

例如,如果您发送未压缩的 JPEG,您可能会发送比 JPEG 大 2.3 甚至 4 倍的文件,例如 70% 的质量。质量差异几乎不会引起注意,但如果您有多个图像,速度差异可能会很大。

要求是压缩级别至少为 85%。

Lighthouse 所做的是在将压缩级别设置为 85% 后检查文件大小,如果文件大小节省超过 4Kb,它将显示图像警告。

至于如何实现压缩完全取决于您以及您正在运行的任何服务器环境/语言。

如果在您的示例中使用转换二进制文件可能以 4:2:2 进行色度二次采样并将质量设置为 75,则屏幕更加生动,因为编写了该指南,因此颜色比 85% 之间的质量差异更明显和 75% 的压缩率。不过,这纯粹是一个建议,你做最适合你的事情。

我链接的第二个文档是您应该尽可能在兼容的浏览器中使用 WebP 图像

这不是您链接的文档的直接替代品,但可以在质量相当的情况下产生更小的图像尺寸。

于 2020-10-23T13:05:02.657 回答