WebP格式的主要优势在于其高效的压缩能力。在相同画质下文件更小（WebP格式的图片体积比JPEG格式小25%至34%，而无损WebP相比PNG减少26%的大小）。这可以带来更快的加载速度，节省带宽，提升用户体验，尤其是在移动端。现代浏览器都支持webp格式，具体情况如下：
- Google Chrome：几乎所有版本支持
- Mozilla Firefox：从版本65开始支持
- Microsoft Edge：新版本的Edge（基于Chromium）完全支持，而旧版的Edge不支持。
- Safari：在macOS Big Sur及iOS 14之后开始支持，但在早期版本中并不支持。
- Internet Explorer：不支持
新图片文件上传
WordPress里，文件上传后自动转换为webp插件：Auto WebP Converter & Logger，或者手工先转换为webp格式再上传。另外，到5202年了，还没有截图工具支持保存为webp文件，图片浏览工具基本都支持了。
已有图片文件转换为webp
格式转换为webp
转换工具
Bash
sudo apt install webp
2 个已升级，32 个新安装，0 个要删除，4 个未升级。
# 将webp转为其他图片格式
dwebp mycat.webp -o mycat.png
# 将图片转换为webp，更多参数说明：https://developers.google.cn/speed/webp/docs/cwebp?hl=zh-cn
cwebp -q 85 some.jpg -o target.webp单个文件对比
Bash
$ find . -type f -name "二〇二五_screenshot*.png" -exec cwebp -q 85 "{}" -o "{}.webp" \;
$ ll 二〇二五_screenshot*
-rw-r--r-- 1 nginx nginx 258K Dec 9 21:39 二〇二五_screenshot-1024x768.png
-rw-rw-r-- 1 nginx nginx 44K Dec 12 21:27 二〇二五_screenshot-1024x768.png.webp
-rw-r--r-- 1 nginx nginx 14K Dec 9 21:39 二〇二五_screenshot-150x150.png
-rw-rw-r-- 1 nginx nginx 2.5K Dec 12 21:27 二〇二五_screenshot-150x150.png.webp
-rw-r--r-- 1 nginx nginx 32K Dec 9 21:39 二〇二五_screenshot-300x225.png
-rw-rw-r-- 1 nginx nginx 5.2K Dec 12 21:27 二〇二五_screenshot-300x225.png.webp
-rw-r--r-- 1 nginx nginx 160K Dec 9 21:39 二〇二五_screenshot-768x576.png
-rw-rw-r-- 1 nginx nginx 28K Dec 12 21:27 二〇二五_screenshot-768x576.png.webp
-rw-r--r-- 1 nginx nginx 212K Dec 9 21:39 二〇二五_screenshot.png
-rw-rw-r-- 1 nginx nginx 60K Dec 12 21:27 二〇二五_screenshot.png.webp批量转换
Bash
cd /wordPress/wp-content/uploads
# 找出图片文件后缀名 jpeg jpg png，find -type f比ls -1R更合适。
find 20* -type f|awk -F. '{print $NF}'|sort -u
# find 20* -type f -regex ".+\.\(jpeg\|jpg\|png\)$" 也是等效的
find 20* -type f \( -name "*.jpeg" -or -name "*.jpg" -or -name "*.png" \) > pngList.txt
wc -l ~/pngList.txt # 940
find 20* -type f \( -name "*.jpeg" -or -name "*.jpg" -or -name "*.png" \) -exec cwebp -q 85 "{}" -o "{}.webp" \;
find 20* -type f -name "*.webp" > ~/webpList.txt
wc -l ~/webpList.txt # 940 媒体库清理插件排除
转换后的webp文件，在媒体库里是看不到，还是只能看到原有的png/jpg/jpeg文件。如果安装这类插件，且能访问服务器的本地目录文件的话，需要做排除。
更新url里的文件
方法一：更新数据库记录
看了一下数据库，在 select * from wp_postmeta m WHERE m.meta_key LIKE '_wp_attachment_metadata%'; 里，meta_value 有image/png字样，暂时不考虑这个方法了。
方法二：使用nginx的try_files
这个方法的缺点：wordpress里删除老图片后，还需要到服务器上删除对webp文件。
原配置
# 防盗链，但排除特定URI；valid_referers none blocked 可允许无引用访问，PDF.js View插件是有引用访问。
location ^~ /wp-content/uploads/20 {
valid_referers t725.cn *.t725.cn *.google.com *.bing.com *.baidu.com;
if ($invalid_referer) {
return 307 $scheme://$host/additional/anti-theft.png;
}
}新配置
# 防盗链，但排除特定URI；valid_referers none blocked 可允许无引用访问，PDF.js View插件是有引用访问。
location ^~ /wp-content/uploads/20 {
valid_referers t725.cn *.t725.cn *.google.com *.bing.com *.baidu.com;
if ($invalid_referer) {
return 307 $scheme://$host/additional/anti-theft.png;
}
location ~ .*\.(jpeg|jpg|png)$ {
try_files $uri.webp $uri =404;
}
}配置生效：$ sudo nginx -t && sudo nginx -s reload
验证：由于是使用try_files，而不是return 30x，所以nginx只是替换了数据，并没有发生跳转。
备份+删除。
# 使用 find + 7za
find 20* -type f \( -name "*.jpeg" -or -name "*.jpg" -or -name "*.png" \) > pngList.txt
sudo 7za a -p251212 -spf2 251212_pngBak.7z -i@251212_pngList.txt
# 使用 find + tar，处理特殊字符
sudo find /data/www/wordPress/wp-content/uploads/20* \( -name "*.jpg" -o -name "*.jpeg" -o -name "*.png" \) -print0 | sudo tar -czvf /data/OCI_Ubuntu/wordPress/251212_pngBak.tar.gz --null -T -
# 删除
find 20* -type f \( -name "*.jpeg" -or -name "*.jpg" -or -name "*.png" \) -delete
发表回复