Lighthouse — это инструмент аудита веб-сайтов, который помогает разработчикам предоставлять возможности и диагностику для улучшения пользовательского опыта своих сайтов.
Lighthouse 9.0 доступен сразу из командной строки, в Chrome Canary и в PageSpeed Insights . Он появится в стабильной версии Chrome в Chrome 98.
Изменения API
Большинству пользователей в этом выпуске не придется столкнуться с какими-либо изменениями, нарушающими рабочий процесс. Если вы запускаете собственный аудит Lighthouse или используете инструменты, которые зависят от деталей в формате JSON отчета Lighthouse, в версии 9.0 могут быть некоторые критические изменения, о которых вам необходимо знать.
Полный список изменений смотрите в журнале изменений версии 9.0 .
Маяк для пользовательских потоков
У Lighthouse есть новый API пользовательского потока, который позволяет проводить лабораторное тестирование в любой момент жизненного цикла страницы.
Puppeteer используется для создания скриптов загрузки страниц и запуска синтетических взаимодействий с пользователем, а Lighthouse можно вызывать несколькими способами для получения ключевой информации во время этих взаимодействий. Это означает, что производительность можно измерить во время загрузки страницы и во время взаимодействия с ней.
Дополнительные сведения см. в руководстве по пользовательским потокам Lighthouse и примерах кода .
Обновление отчета
Отчет Lighthouse был обновлен, чтобы улучшить читабельность и сделать более понятным источник отчета и способ его создания.
Последний снимок экрана был встроен в верхнюю часть отчета, чтобы сразу было видно, правильно ли загружается тестируемая страница и соответствует ли ожидаемый формат.
Сводная информация в нижней части отчета также была переработана, чтобы лучше отражать работу Lighthouse и сбор отчета.
Чтобы увидеть новый отчет в действии, попробуйте Lighthouse 9.0 или посетите этот пример отчета .
Связанные элементы доступности
Распространенная проблема доступности заключается в том, что вещи, которые должны быть уникальными на странице, не являются уникальными, например, если идентификатор, указанный в атрибуте aria-labelledby , используется в нескольких элементах .
Lighthouse всегда предупреждал об этой ситуации, но перечислял только первый экземпляр элемента с повторяющимся идентификатором, что часто вызывало путаницу, поскольку некоторые пользователи предполагали, что он показывает все элементы, вызывающие проблему. Поскольку Lighthouse показывал только один элемент, они могли предположить, что это ошибка, поскольку этот элемент помечен как дубликат.
В Lighthouse 9.0 теперь перечислены все элементы, имеющие этот идентификатор:
Эта функциональность «связанных узлов» предоставляется axe-core , поэтому она также может появляться в других проверках доступности.
Дополнительные сведения см. в разделе «Проблема со сбором пользовательских отчетов и запрос на включение реализации» .
Бегущий маяк
Lighthouse доступен в Chrome DevTools, npm (в виде модуля Node и CLI) и в виде расширения браузера (в Chrome и Firefox ). Он поддерживает многие сервисы Google, включая web.dev/measure и PageSpeed Insights .
Чтобы попробовать интерфейс командной строки Lighthouse Node, используйте следующие команды:
npm install -g lighthouse
lighthouse https://www.example.com --view
Свяжитесь с командой Маяк
Чтобы обсудить новые функции, изменения в версии 9.0 или что-либо еще, связанное с Lighthouse:
- Сообщите о проблеме или отправьте отзыв в трекере проблем Lighthouse GitHub .
- Задавайте вопросы на дискуссионных форумах Lighthouse GitHub .
- Свяжитесь с командой Lighthouse в Твиттере @____lighthouse .