通过去除Metadata减小图片大小(译文)

495 阅读2分钟

引文

根据httparchive.org的数据, 图片在桌面或是移动端页面占据了43%的page weight . 对于处理图片有很多合适的方式, 例如使用合适的类型, 为设备和情况提供适当的图像 (srcset or <picture>), 以及无损或有损优化。一个好的无损优化(在不降低图像质量的情况下减少文件大小)是删除存储相机设置、纬度/经度等内容的图像元数据。metadata不用于可视化显示,因此删除它可以安全地减小图像文件的大小,从而提高站点性能.

MetaData的类型

  • EXIF (Exchangeable Image File Format) – 相机保存图像时自动添加的元数据(相机品牌/型号、焦距等)
  • IPTC (International Press Telecommunications Council) – 手动添加到图片上 (描述,关键词等等.)
  • XMP (Extensible Metadata Platform) – 被一些图片编辑工具所添加

如何查看metaData

  • windows系统下,右键单击图像选择“财产”并查看“详细信息”选项卡
  • 像 www.exifdata.com/ 这类的在线工具可以展示出metadata的扩展列表
  • 我个人最喜欢的是Fiddler Classic的扩展包Image Bloat. 下载后,选择“规则”(Rules)选项卡并选择“显示图像Blob”(Show Image Bloat).访问网站并在启用扩展的情况下导航,它将使用砖块指示元数据使用的图像大小部分 image.png

如何删除metaData

警告:只有当这些是您自己的照片或具有权限时,才能删除元数据,因为它可能包含法律要求的版权或许可信息!

  • windows系统: 切换到详情(details)选项栏,选中删除属性或者个人信息 (Remove Properties and Personal Information),选择删除源文件的metaData或者另存为不包含metaData的图片.
  • jpegtran – CLI 重新编码 JPEGs 并且删除 metadata, 从这下载 jpegtran. 下面这个命令可以得到一份不包含metaData的备份图片

image.png

结论

图像元数据在某些脱机情况下很有用,但由于文件大小增加,会减慢网站图像下载速度。由于元数据不用于图像的视觉显示,因此可以使用许多不同的工具将其删除。Fiddler的Image Bloat扩展提供了一种简单的方式,可以在网站中查找仍然有元数据的图像,以及存储元数据的图像大小百分比。在上面的示例中,元数据为15%,我们使用jpegtran将文件大小从46.9K减少到31.2K!

原文链接:calendar.perfplanet.com/2022/reduce…