Safari中WebP图片异常是WebKit内存调度问题，非格式不支持；需关闭异常标签页、禁用预加载、清理缓存、启用后台解码，并通过标签或User-Agent动态转码兜底。
当你在Safari中打开网页，发现本该显示的WebP图片变成小问号、仅上半截可见、整页白屏或直接不加载，这不是格式不支持的假象——iOS 14+和macOS Monterey+已原生支持WebP，但WebKit对高密度、带Alpha通道或未压缩WebP的并发解码存在内存调度失控问题，必须针对性干预。
立即终止异常渲染进程
不要刷新页面，不要切换标签页，不要点击地址栏——这些操作在崩溃状态下大概率无响应。将鼠标悬停在异常标签页标题上，等待约2秒出现灰色“×”后直接点击关闭；若悬停无反应，按下【Option + Command + W】强制杀掉该标签页专属的WebContent子进程。这一步直切异常渲染上下文，避免崩溃蔓延到其他正常标签页。
若已无法聚焦该标签页，先按 Command + Tab 切回 Safari 窗口，再执行快捷键。
禁用后台图片预加载与自动播放
Safari默认为不活跃标签页持续预解码图片，当页面含50+张高清WebP时，内存峰值极易超限。
点击 Safari → 偏好设置 → 标签页，取消勾选以下三项：【预加载下一个页面】、【自动播放视频】、【在后台为不活跃标签页暂停播放】（注意：最后一项必须保留关闭状态）。
必须重启Safari才能生效，否则设置停留在内存缓存中不起作用。
分层清理图像相关缓存
第一步：Safari → 偏好设置 → 隐私 → 管理网站数据 → 搜索目标域名（如 taobao.com、unsplash.com）→ 选中条目 → 点击“移除”。
第二步：启用开发菜单（偏好设置 → 高级 → 勾选“在菜单栏中显示开发菜单”）→ 顶部菜单栏选择 开发 → 清空缓存。
第三步：打开终端，执行 rm -rf ~/Library/Caches/com.apple.Safari/Cache.db* → 回车。此命令删除底层SQLite缓存数据库，比界面操作更彻底清除WebP帧缓冲区残留块。
强制启用后台图片解码禁用
方法一：地址栏输入 safari://develop 回车 → 点击顶部“实验性功能” → 向下滚动找到【Disable image decoding in background tabs】 → 勾选启用。
方法二：若上述选项不可见，先确保已开启开发菜单（Safari → 偏好设置 → 高级 → 勾选“在菜单栏中显示开发菜单”）→ 再访问 safari://develop 页面。
验证是否为WebP格式导致的问题
第一步：在Safari中打开目标网页，按 Option + Command + I 打开开发者工具 → 切换到“网络”标签页 → 刷新页面 → 在过滤框输入 .webp 或点击任意图片资源 → 查看右侧“标头”中的 Content-Type 字段。若显示 image/webp，且状态码为 200，则确认问题根源在此。
第二步：右键（或长按）该图片 → 选择“在新标签页中打开图像” → 观察地址栏URL后缀。若以 .webp 结尾，且新标签页白屏或提示“无法打开”，基本可锁定为Safari兼容性问题。
注意：不要依赖网页源码里写的 
来判断——很多站点实际通过服务端逻辑动态返回格式，源码只是占位符。
前端适配：用 标签兜底
方法一：基础双格式切换（适合静态页面或少量图片）
将原 
替换为：
浏览器会优先尝试加载 source 中声明的 WebP 资源；若不支持（如 Safari），则自动回退到 img 标签里的 PNG/JPG。
必须确保 logo.png 文件真实存在且与 WebP 内容完全一致，否则视觉错位无法避免。
后端适配：根据 User-Agent 动态转码
方法一：Nginx 配置自动识别并重写（适用于自建服务器）
在对应 server 块中加入：
map $http_accept $webp_suffix { ~*webp ".webp"; default ""; }
location ~* \.(png|jpe?g)$ { add_header Vary Accept; try_files $uri$webp_suffix $uri =404; }
原理：当请求 icon.png 时，Nginx 检查请求头 Accept: image/webp 是否存在，存在则尝试找 icon.png.webp；找不到就返回原图。Safari 不带该头，永远走原图路径。
方法二：阿里云 OSS 快速降级（无需改代码）
对所有 WebP 图片 URL 末尾追加参数：?x-oss-process=image/format,jpg。
例如原链接：https://www.php.cn/link/006c56869df4f6cad4a6c2049dd87c17 → 改为：https://www.php.cn/link/006c56869df4f6cad4a6c2049dd87c17?x-oss-process=image/format,jpg
