图片占到了网站的大部分流量，图片压缩可以让图片体积更小，加载速度更快

1 有损压缩和无损压缩

有损压缩，删除部分数据，代表的是jpg
无损压缩，压缩像素数据,代表是png

2 图片存储格式

2.1 格式以及区别

2.2 jpg和png

JPG在存储图像时会把图像分解成88像素的栅格，然后对每个栅格的数据进行压缩处理，当我们放大一幅图像的时候，就会发现这些88像素栅格中很多细节信息被去除，而通过一些特殊算法用附近的颜色进行填充。这也是为什么我们用JPG存储图像有时会产生块状模糊的原因

PNG是我们最常见的一种采用无损压缩的图片格式。无损压缩在存储图像前会先判断图像上哪些地方是相同的哪些地方是不同的。它的压缩原理是通过索引图像上相同区域的颜色进行压缩和还原的，这就意味着只有在图像上出现的颜色数量小于我们可以保存的颜色数量时，我们才能真实的记录和还原图像，否则就会丢失一些图像信息。

PNG8最多只能索引256种颜色，所以对于颜色较多的图像不能真实还原；PNG24则可以保存1600多万种颜色，基本能够真实还原我们人类肉眼所可以分别的所有颜色；PNG格式最多可以保存48位颜色通道

2.3 png8和png24

PNG8和PNG24后面的数字则是代表这种PNG格式最多可以索引和存储的颜色值。”8″代表2的8次方也就是256色，而24则代表2的24次方大概有1600多万色。

PNG8还支持1位的布尔透明通道，所谓布尔透明指的是要么完全透明要么完全不透明。而PNG24则支持8位（256阶）的alpha通道透明，也就是说可以存储从完全透明到完全不透明一共256个层级的透明度（即所谓的半透明）

3.webp

WebP is a new image format that provides lossless and lossy compression for images on the web. WebP lossless images are 26% smaller in size compared to PNGs. WebP lossy images are 25-34% smaller in size compared to JPEG images at equivalent SSIM index.

WebP 探寻之路提供了很多webp压缩的优化建议，可以参考:

WebP 在解码时间与 PNG 有较明显差异（毫秒级别）之外，总体使用体验和 PNG 基本无差异。同时也需要明确，移动设备的发展迅猛，硬件升级快，上一年的表现也许在今年又有了明显的提升。所以，在 App 中使用 WebP 基本没有技术阻碍。

4.理想的压缩

理想的压缩模式个人认为能做到下面这样会达到比较好的效果：

1.用户上传的原图压缩
2.其次通过图片各项属性的判断，程序认为PNG格式的图片更优，于是选择转换一张PNG格式的图片(或者从PNG转成JPEG)
3.最后为所上传的图片生成一张WebP格式的图片

目前我们2，3都是没有做，只做了1。步骤2较复杂，和图片的色值、透明度、面积都有关，步骤3 webp的部分由图片提供商做了。目前我们针对所有的图片都做了压缩，没有提供用户选择压缩比(默认使用有损压缩，压缩系数0.5),所幸的是用户也没觉得糊了

参考：