处理Web图片优化

在网站的尺寸平均在 2Mb 和 3Mb 之间，想象一下，一张未压缩的图片就占掉了 80% 的流量。在网速较慢的移动网络上，3Mb 大小的图片要花很久才能加载完毕。如果等待网站加载的用户大部分时间花在等待单张图片加载，那网站会损失不少流量。想想就可怕，是吗？

所以，在保证图片分辨率和画质可接受的前提下，我们可以做什么来优化下图片呢？

在线图片优化

如果你的项目是一个简单的静态网站，只有少量不经常变动（甚至从来不会变动）的图片，那么你可以直接使用在线工具。这些工具使用各种算法压缩图像，效果很不错，对简单项目而言完全够用。
 

我个人所知，比较著名的在线工具有：

•  Compressor.io，支持 JPG、PNG、SVG、GIF，每次上传 1 个文件
•  Squoosh，支持 JPG、PNG、SVG、GIF，每次上传 1 个文件
•  Optimizilla，支持 JPG、PNG，最多每次上传 20 个文件
•  TinyPNG，支持 JPG、PNG，最多每次上传 20 个文件
•  SVGMinify，支持 SVG，每次上传 1 个文件
•  svgomg，支持 SVG，每次上传 1 个文件

自动化解决方案

然而，如果你做的是多人协作的复杂项目，使用大量图片，在加入每张图片时都手动操作一下很乏味。同时，还存在由于人为错误或其他因素导致一些图片没有优化的风险。

复杂项目常常使用同样复杂的构建系统，比如 Gulp、Webpack、Parcel。配置一下这类构建系统，加入图片优化插件很方便。这样就可以完全自动化图片优化过程，在项目中加入图片后就可以优化它们。

（编辑：常州站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!