Performance (Производительность) Lighthouse
оценивает производительность страницы через ряд показателей, ключевыми
из которых являются:
- First Contentful Paint (FCP) — время до отображения
первого содержимого. Низкое значение указывает на быструю реакцию
страницы, высокое — на задержки при рендеринге.
- Largest Contentful Paint (LCP) — время загрузки
основного визуального контента. LCP выше 2,5 секунд считается медленным,
и это сигнализирует о необходимости оптимизации ресурсов или
рендеринга.
- Cumulative Layout Shift (CLS) — суммарный сдвиг
макета. Высокие значения CLS указывают на нестабильность интерфейса и
потенциальное ухудшение пользовательского опыта.
- Total Blocking Time (TBT) — суммарное время
блокировки основного потока. Высокий TBT говорит о том, что скрипты или
тяжелые задачи задерживают взаимодействие с сайтом.
Понимание этих метрик позволяет определить узкие места в рендеринге,
блокирующие загрузку или взаимодействие с контентом.
Accessibility (Доступность)
Lighthouse анализирует доступность сайта для пользователей с
ограниченными возможностями:
- Контраст текста — низкий контраст приводит к
трудностям чтения. Рекомендуется поддерживать минимальное соотношение
4.5:1 для обычного текста.
- Атрибуты ARIA и семантика — корректная разметка
элементов помогает вспомогательным технологиям, например, экранным
читалкам.
- Фокусировка и навигация с клавиатуры — ошибки здесь
снижают общую доступность сайта. Проблемы выявляются через пропущенные
или некорректные tabindex и элементы, которые не могут получать
фокус.
Каждый пункт сопровождается конкретными рекомендациями по
исправлению, что облегчает внедрение улучшений.
Best Practices (Лучшие
практики)
Эта категория оценивает соблюдение современных стандартов
веб-разработки:
- HTTPS и безопасные соединения — Lighthouse
проверяет использование безопасного протокола, наличие актуальных
сертификатов и отсутствие смешанного контента.
- Использование современных API — устаревшие
технологии и неэффективные методы работы с сетью и ресурсами снижают
рейтинг.
- Оптимизация изображений и ресурсов — проверки
включают размеры изображений, форматы, lazy-loading и сжатие. Нарушения
напрямую влияют на скорость загрузки.
SEO (Поисковая оптимизация)
Lighthouse оценивает базовую SEO-оптимизацию страницы:
- Теги title и meta description — наличие уникальных
и информативных тегов.
- Заголовки и структура документа — правильная
иерархия h1–h6 обеспечивает понятную семантику.
- Атрибуты alt для изображений — обязательны для SEO
и доступности.
- Мобильная оптимизация — адаптивность сайта
проверяется автоматически и влияет на позицию в поисковой выдаче.
Ошибки в SEO обычно сопровождаются конкретными рекомендациями, что
упрощает исправление и улучшение видимости сайта.
PWA (Прогрессивные
веб-приложения)
Lighthouse проверяет реализацию возможностей PWA:
- Service Worker и кеширование — наличие и
корректность реализации. Ошибки приводят к проблемам с
офлайн-доступом.
- Manifest файл — корректные иконки, описание и
настройки темы обязательны для добавления на домашний экран.
- HTTPS — необходим для функционирования всех
PWA-функций.
Каждая ошибка содержит подробное объяснение причины и влияние на
пользовательский опыт, что делает исправление точным и
целенаправленным.
Интерпретация отчета
- Баллы Lighthouse — значения от 0 до 100, где 90–100
считается отличным результатом, 50–89 средним, ниже 50 — низким. Баллы
не дают полного представления без анализа конкретных метрик.
- Подробные рекомендации — каждый пункт отчета
снабжен ссылкой на документацию и конкретными шагами исправления.
- Сравнение показателей — полезно анализировать
динамику метрик после внесения изменений, чтобы объективно оценить
эффективность оптимизации.
Использование отчета Lighthouse как руководства по улучшению
позволяет системно подходить к производительности, доступности, SEO и
качеству веб-приложений.