更新了适用于 JPG 和 PNG 的 Pageinsights 兼容图像优化命令答案

【问题标题】：Updated Pageinsights compatible Image optimzation commands for JPG & PNG更新了适用于 JPG 和 PNG 的 Pageinsights 兼容图像优化命令
【发布时间】：2021-02-06 04:45:35
【问题描述】：

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 页面中的示例，但没有提及优化图像。

【问题讨论】：

标签： google-pagespeed pagespeed-insights google-pagespeed-insights-api

【解决方案1】：

简答

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

长答案

本指南已替换为两个不同的文档（据我所知）

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

和

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

第一个文档是主要文档。

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

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

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

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

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

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

我链接的第二个文档是您应该尽可能做的事情，using WebP images in compatible browsers。

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

【讨论】：