Ошибка Google Lighthouse при загрузке изображений webp

Я пытаюсь улучшить свой результат в Google Lighthouse. Он рекомендовал использовать форматы изображений следующего поколения, включая webp, поэтому я реализовал обслуживание webp вместо изображений, где заголовок принятия запроса включает webp, используя конфигурацию Nginx примерно так ...

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 показывает ошибку, поэтому я не могу быть уверен, что все реализовал правильно. Что означает эта ошибка?

возможности маяка


person Billy Moon    schedule 05.07.2019    source источник
comment
Что-нибудь регистрирует nginx, когда это не удается? Также я хотел бы знать, видите ли вы что-нибудь в консоли браузера, на вкладке сети, когда происходит тест   -  person Tarun Lalwani    schedule 20.07.2019
comment
Также посмотрите, помогает ли это? github.com/igrigorik/webp-detect   -  person Tarun Lalwani    schedule 20.07.2019
comment
Если возможно, не могли бы вы поделиться URL-адресом сайта, на котором вы тестируете?   -  person Saiprasad Balasubramanian    schedule 23.07.2019
comment
@billy moon, где моя награда? Я ответил, когда награда еще была открыта.   -  person mario ruiz    schedule 29.07.2019
comment
@marioruiz Я ждал повторного развертывания и смог проверить ваш ответ только сегодня, после истечения срока награды. У меня нет возможности вручить его вам сейчас, похоже, награда потеряна: - /   -  person Billy Moon    schedule 29.07.2019


Ответы (2)


Обновите ваш Lighthouse до версии 2.4 и новее

В предыдущих версиях расширение webp обрабатывалось некорректно

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

Если это не сработает, возможно, вам потребуется сообщить о проблеме на Github.

person mario ruiz    schedule 25.07.2019

Вероятно, NGINX не обслуживает их с правильным image/webp типом MIME.

Попробуйте добавить это в файл /etc/nginx/mime.types и перезапустите сервер:

types {

    image/webp webp;

    ...
}
person Martin Zeitler    schedule 26.07.2019