UD5工具箱
WebP 格式
WebP 是 Google 于 2010 年推出的一种现代图片格式，旨在为 Web 提供比 JPEG 和 PNG 更好的压缩效率。WebP 支持有损压缩和无损压缩两种模式，有损压缩模式在同等视觉质量下通常比 JPEG 小 25-34%，无损压缩模式比 PNG 小约 26%。WebP 还支持透明通道（Alpha Channel）和动画功能，使其成为 PNG 和 GIF 的潜在替代方案。WebP 文件以 .webp 扩展名保存，使用 VP8/VP9 视频编码技术的帧内编码作为底层压缩算法。目前 WebP 已被所有主流浏览器支持，包括 Chrome、Firefox、Safari 和 Edge。
AVIF 格式
AVIF（AV1 Image File Format）是基于 AV1 视频编码格式的图片文件格式，由 AOM（Alliance for Open Media）联盟于 2019 年发布。AVIF 继承了 AV1 编码的先进压缩技术，包括改进的帧内预测、自适应量化和更好的变换核选择等特性。在相同视觉质量下，AVIF 通常比 WebP 小约 10-20%，比 JPEG 小约 50%。AVIF 支持 8 位、10 位和 12 位色深，支持 HDR（高动态范围）内容，支持透明通道和动画。AVIF 以 .avif 扩展名保存，目前已被 Chrome、Firefox 和部分版本的 Safari 支持。
有损压缩（Lossy Compression）
有损压缩是一种通过丢弃部分图像信息来实现高压缩率的编码方式。在有损压缩过程中，编码器会分析图像数据并移除人眼不太敏感的细节信息，如高频纹理和微妙的颜色变化。质量参数（Quality）控制着保留信息的多少：较高的质量值保留更多细节但文件较大，较低的质量值丢弃更多细节但文件更小。有损压缩的优势在于可以在可接受的质量损失范围内实现显著的文件体积减小，是 Web 图片优化中最常用的压缩方式。选择合适的质量参数需要在视觉质量和文件大小之间取得平衡。
无损压缩（Lossless Compression）
无损压缩是一种在不丢失任何图像信息的前提下减小文件体积的编码方式。无损压缩利用图像数据中的统计冗余和空间相关性，通过熵编码、字典编码等技术实现数据的紧凑表示。无损压缩后的文件可以完全还原为与原始数据一模一样的图像，因此适用于对质量要求极高的场景，如医学影像、卫星图像和法律文档截图等。在 WebP 和 AVIF 中，无损压缩的压缩率通常低于有损压缩，但仍优于传统的 PNG 无损格式。WebP 无损模式比 PNG 小约 26%，AVIF 无损模式的压缩效率更高。
压缩质量参数（Quality Parameter）
质量参数是控制有损压缩强度的数值指标，通常以 0 到 100 的百分比形式表示。质量参数 100 代表最高质量（最小有损），理论上等同于无损压缩。较低的质量参数值意味着更大的信息丢弃量，文件体积更小但视觉质量也更低。在实际应用中，不同格式对质量参数的响应曲线不同：WebP 在质量 75-85 范围内通常能提供最佳的体积与质量平衡，而 AVIF 由于编码算法的优势，在较低质量级别下仍能保持较好的视觉效果。选择合适的质量参数需要结合具体的图像内容和应用场景进行测试评估。
文件体积（File Size）
文件体积是指图片文件在存储设备上占用的字节数，通常以字节（B）、千字节（KB）或兆字节（MB）为单位。在 Web 开发中，图片文件的体积直接影响着页面的加载时间和网络带宽消耗。研究表明，页面加载时间每增加一秒，用户流失率可能上升 7% 左右，因此减小图片体积是 Web 性能优化的关键环节之一。文件体积受多种因素影响，包括图片的像素尺寸、色深、压缩格式和压缩质量等。在对比不同格式的压缩效果时，文件体积是最直接的量化指标之一。
像素密度与设备像素比（DPR）
设备像素比（Device Pixel Ratio，DPR）是设备的物理像素与逻辑像素之间的比例关系。在高 DPR 设备（如 Retina 显示器，DPR=2 或 3）上，一个逻辑像素对应多个物理像素，因此需要更高分辨率的图片才能获得清晰的显示效果。在选择图片格式和压缩设置时，需要考虑目标设备的 DPR 特性。例如，在 DPR=2 的设备上显示宽度为 400 逻辑像素的图片，需要 800 物理像素宽度的图片才能获得最佳清晰度。不同图片格式在高分辨率下的压缩效率表现可能不同，因此针对目标设备进行专门的格式测试很有必要。
透明通道（Alpha Channel）
透明通道是图片数据中用于存储每个像素透明度信息的额外通道。支持透明通道的图片格式可以在像素级别控制图像的可见度，实现半透明效果和非矩形的视觉形状。在 Web 开发中，透明通道广泛应用于 Logo、图标、叠加层和特效等场景。WebP 和 AVIF 都完整支持 8 位透明通道（256 级透明度），可以替代 PNG 格式提供带透明度的图片。与 PNG 的无损透明不同，WebP 和 AVIF 的有损压缩模式也可以处理带透明通道的图片，通常可以获得比 PNG 更小的文件体积。在对比测试中，带透明通道的图片是评估格式性能差异的重要测试用例。