В разделе «Возможности» отчета Lighthouse перечислены все изображения в старых форматах, а также показана потенциальная экономия за счет использования версий этих изображений в формате AVIF:
Зачем предоставлять изображения в формате AVIF или WebP?
AVIF и WebP — это форматы изображений, которые обеспечивают превосходные характеристики сжатия и качества по сравнению со своими более старыми аналогами JPEG и PNG. Использование этих форматов вместо JPEG или PNG означает, что изображения будут загружаться быстрее и потреблять меньше мобильного трафика.
Формат AVIF поддерживается в Chrome, Firefox и Opera и обеспечивает меньший размер файлов по сравнению с другими форматами при тех же настройках качества. Подробнее об AVIF см. в практическом занятии «Serving AVIF Images Codelab» .
Формат WebP поддерживается в последних версиях Chrome, Firefox, Safari, Edge и Opera и обеспечивает более качественное сжатие изображений в Интернете как с потерями, так и без них. Подробнее о WebP см. в статье «Новый формат изображений для Интернета ».
Как Lighthouse рассчитывает потенциальную экономию
Lighthouse собирает все изображения BMP, JPEG и PNG на странице, конвертирует каждое в WebP и оценивает размер файла AVIF, сообщая о потенциальной экономии на основе показателей конвертации.
Совместимость с браузерами
Формат WebP поддерживается последними версиями Chrome, Firefox, Safari, Edge и Opera, тогда как поддержка формата AVIF более ограничена. Для поддержки старых браузеров потребуется предоставить резервное изображение в формате PNG или JPEG. Обзор методов резервного копирования и список поддерживаемых браузерами форматов изображений см. в статье «Как определить поддержку WebP браузером?» ниже.
Чтобы узнать текущую поддержку браузерами каждого современного формата, ознакомьтесь с записями ниже:
Руководство по конкретному стеку
AMP
Рассмотрите возможность отображения всех компонентов amp-img в форматах WebP, а также укажите соответствующий резервный вариант для других браузеров.
Друпал
Рассмотрите возможность установки и настройки модуля для использования форматов изображений WebP на вашем сайте. Такие модули автоматически генерируют WebP-версию загруженных изображений для оптимизации времени загрузки.
Джумла
Рассмотрите возможность использования плагина или сервиса, который автоматически преобразует загруженные вами изображения в оптимальные форматы.
Магенто
Рассмотрите возможность поискать на Magento Marketplace различные сторонние расширения для использования новых форматов изображений.
айфон
Обратите внимание, что изображения WebP, AVIF и видео WebM не будут работать на iPhone под управлением iOS ниже 16.
WordPress
Рассмотрите возможность использования плагина или сервиса, который автоматически преобразует загруженные вами изображения в оптимальные форматы.