为什么同一张图片换个格式就小很多
TL;DR
用通俗方式解释有损压缩、无损压缩和预测编码，帮助读者理解 WebP、JPEG 与 PNG 的区别。
图片压缩并不是简单删除像素，而是利用相邻区域的规律减少需要保存的数据。本文解释 WebP 的有损与无损压缩，以及不同图片格式的适用场景。
同一张照片保存成不同格式，文件大小可能相差几倍。很多人把它理解成“格式不同，所以占用空间不同”，但格式只是容器，真正决定大小的是压缩算法如何利用图像中的规律，以及你愿意牺牲多少细节来换取更小的文件。
图片里有大量可预测的信息
相邻像素往往很相似：天空是一大片接近的蓝色，墙面是一块连续的颜色，照片里的边缘通常只在少数地方发生明显变化。压缩算法可以先预测某个区域应该长什么样，再只记录预测错误的部分。错误越小，需要存储的数据就越少。
WebP 的有损压缩使用了和 VP8 视频关键帧相关的预测编码思路；无损压缩则尝试复用已经出现过的图像片段，在解码时准确还原原像素。两者的目标不同：有损压缩追求“人眼看起来接近但文件更小”，无损压缩追求“解压后和原图完全一致”。
为什么 PNG 不一定比 JPEG 小
PNG 更擅长保存需要透明通道、文字边缘或大块纯色的图形，并支持无损压缩。JPEG 更适合照片，可以通过降低精度换取更小文件。若一张照片使用 PNG 保存，算法不愿丢掉任何像素细节，文件反而可能很大；如果一张简单图标使用 JPEG，压缩产生的边缘噪点又会很明显。
WebP 同时支持有损、无损和透明度，因此可以覆盖更多场景。Google 的说明给出了一个有代表性的方向：在相近视觉质量下，WebP 往往比传统 PNG 或 JPEG 更节省空间，但具体大小仍取决于原图内容、编码参数和目标质量，不能把某个固定百分比当成所有图片的保证。
小文件不是无条件的胜利
压缩质量越低，文件越小，但细节、文字边缘和颜色过渡可能变差；质量越高，文件越大，下载和存储成本也会上升。图片还可能需要解码时间、透明背景、动画或编辑能力。给网页用的封面和给设计软件继续修改的源文件，适合的格式不一定相同。
判断格式时可以先看内容：照片优先考虑有损格式，截图、图标和透明素材要看是否需要无损与 Alpha 通道，网页图片还要结合浏览器兼容性、加载速度和缓存策略。不要只追求“最小文件”，而要在画质、体积和用途之间找到平衡。
