优化图像为Phonegap应用程序

Optimizing images for Phonegap app

本文关键字：应用程序 Phonegap 图像 优化      更新时间：2023-09-26

优化iOS原生开发的图像非常简单，只需使用针对不同设备和分辨率的图像目录，但在Javascript中，优化技术是什么?以不同的分辨率保存一堆相同的图像，并根据设备大小选择最佳图像，这是最佳实践吗?你如何有效地做到这一点呢?我正在开发这个应用程序在iOS和Android上发布，所以我应该如何优化我的图像，使我有最好的质量，同时保持小的应用程序大小和最佳性能?

我不是Phonegap专家，但我猜你使用HTML作为界面。在这种情况下，我认为您会寻找<picture>，特别是子标签<source>及其srcset和media属性。

查看更多MDN: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture

如果这些图像类似于图标或其他矢量类型的图像，则使用可缩放的SVG。

如果它们是PNG或JPG，那么将图像设置为较大，例如1000px，但压缩50%。它们穿大码的很好看，穿小码的很好看。

此外，如果用户必须向下滚动才能看到大量图像，则集成延迟加载图像。使用延迟加载，它们只在进入视图时加载。

相关文章：