一、webp 是什么？

webp 是一种新的图像格式，用于web项目，可以大大提高网站访问速度。

• 同样的分辨率，大小比 jpg、png 小 25% 以上；
• Chrome、Firefox、Edge、Opera 等都支持此格式。

二、怎么使用？

1、下载和安装

下载对应平台软件包，软件包中包含 png/jpg 与 webp 相互转换的工具以及开发所需的库和头文件。

• libwebp-1.2.1-windows-x64.zip ：适用于 Windows-x64
• libwebp-1.2.1-linux-x86-64.tar.gz：用于 GNU/Linux-x86_64
• libwebp-1.2.1-mac-10.15.tar.gz：适用于 macOS 10.15+ (Catalina)

2、工具介绍

• cwebp

将 图像 转换为 WebP，支持的格式有：PNG、JPEG、TIFF、WebP 或原始 Y'CbCr 样本。

cwebp -q 100 image.png -o image.webp

• dwebp

将 WebP 转换为图像，支持的格式有：为 JPE、PNG、PAM、PPM 或 PGM 图像。

dwebp picture.webp -o output.png

• gif2webp

将 GIF 图像转换为 WebP。

gif2webp picture.gif -o picture.webp

• img2webp

从输入图像序列创建动画 WebP 文件，支持的格式有：PNG、JPEG、TIFF 或 WebP。

img2webp -loop 2 in0.png -lossy in1.jpg -d 80 in2.tiff -o out.webp

• vwebp

解压缩 WebP 文件并使用 OpenGL 在窗口中显示它。

vwebp picture.webp

三、png/jpg 与 Webp 相互转换

下面是在 Mac 系统下，进行 图片格式 相互转换的实例。

// 1、安装
brew install webp

// 2、webp 转 png/jpg
dwebp xxx.webp -o xxx.png
dwebp xxx.webp -o xxx.jpg

// 3、png/jpg 转 webp
cwebp -q 100 xxx.png -o xxx.webp
cwebp -q 100 xxx.jpg -o xxx.webp

// 4、批量 webp 转 png
find ./ -name "*.webp" -exec dwebp {} -o {}.png;

四、进一步无损压缩

可以对 webp、png、jpg 文件，进一步无损压缩，最终可减少 70% 的存储空间。