nginx - Google Lighthouse 加载 webp 图片时出错

标签 nginx webp lighthouse

我正在尝试提高我在 google lighthouse 上的性能得分。它建议使用下一代图像格式,包括 webp,所以我通过使用 Nginx 配置这样的东西来实现服务 webp 代替图像,其中请求接受 header 包含 webp...

map $http_accept $webp_suffix {
  default   "";
  "~*webp"  ".webp";
}

server {
  root /www/;
  listen 80 default_server;
  index index.html;

  location ~* ^\/images\/ {
    expires max;
    add_header Vary Accept;
    try_files $uri$webp_suffix $uri =404;
  }

  location / {
    try_files $uri $uri/index.html =404;
  }

  error_page 404 /404.html;
}

现在页面加载速度更快,并且 webp 方法运行良好,可以回退到不存在 webp 或浏览器不支持的原始图像。但是,灯塔报告显示了一个错误,所以我不能确定我是否正确执行了所有操作。这个错误是什么意思?

lighthouse opportunities

最佳答案

将您的灯塔更新至 2.4 版以上

在以前的版本中,未正确处理 webp 扩展

https://github.com/GoogleChrome/lighthouse/issues/3364

如果这可能不起作用您可能需要在 Github 上提交问题

关于nginx - Google Lighthouse 加载 webp 图片时出错,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56903526/

相关文章:

html - 如何避免 PWA 中的 CORS 问题

nginx - 怎么配置nginx,让部分子域只能访问js/css文件?

node.js - apt-get install -y nginx 更新版本

laravel - 授权 header 仅在 GET 请求上无法到达 API (nginx)

apache - 我可以将一些确切的远程 URL 映射到具有不同端口的本地 URL

Webpack(安可): convert images to webp using image-webpack-loader

Node.js - 将 webp 转换为 jpeg 作为缓冲区(在内存中)

go - exec 没有从 Golang 应用程序运行命令

node.js - 引用错误: URL is not defined when trying to Run lighthouse reports on the command line in linux

laravel - 在灯塔 graphql 文件中声明变量