Непосредственно на скорость загрузки влияет огромное количество факторов, и большинство из них относятся к оптимизации сайта. Когда ресурс попадает к нам, наши специалисты детально его изучают на всех уровнях. Находят ошибки в JavaScript, CSS, построении дерева DOM, изображениях, шрифтах и другом контенте. Исследования базируются на данных сразу нескольких инструментов, что позволяет максимально точно выявить проблемы и решить, как их устранить без вреда для страницы. Наиболее сложная ситуация, когда до нас оптимизировать сайт пытался человек, который не является специалистом. В таких случаях, нам иногда даже приходится полностью его восстанавливать. Проведение всех настроек позволяет не только существенно повысить скорость, но и провести SEO-оптимизацию. Сайт становится полноценным инструментом маркетинга, а поисковые системы повышают его в позициях выдачи.
Одним из инструментов, которые позволяют провести эффективный аудит, является Google Lighthouse. Именно на его данные и опирается поисковая система. Но, при проведении корректных настроек только его не достаточно — это важно учитывать. В данной статье мы рассмотрим, что такое Lighthouse и как им пользоваться.
Что такое Google Lighthouse
По представленным функциям он схож с Google Analytics и PageSpeed Insights. При этом, Lighthouse является самостоятельным инструментом с целым рядом преимуществ:
- В нём собраны основные функции сразу всех сервисов Google
- Доступно проведение аудита как тестовых, так и авторизованных страниц
- Есть общие комментарии, которые позволяют понять в какую сторону двигаться для решения проблемы
Одним из минусов является тот факт, что Lighthouse не имеет русскоязычной версии. Но если вы не являетесь веб-разработчиком, то вам она и не нужна. Оценить общее состояние сайта можно по цифрам, а со всем остальным разберутся профессионалы.
Как запустить Lighthouse и начать с ним работать
Запустить Lighthouse можно несколькими способами: в Chrome DevTools, из командной строки или в виде модуля Node. Указав Lighthouse необходимый для проведения тестирования URL, инструмент запускает серию аудитов на странице, после чего генерирует отчет. Проведя анализ успешных и не удавшихся аудитов, выявляется проблематика сайта. С этими данными веб-разработчик уже может работать, чтобы привести сайт в соответствие требованиям.
Итак, каким образом запустить Lighthouse каждый выбирает для себя, исходя из персональных предпочтений и удобства.
- В Chrome DevTools. Можно легко проверять страницы, которые требуют проверки подлинности, и читать отчеты в удобном формате
- Из командной строки. Можно автоматизировать работу Lighthouse с помощью сценариев
- В качестве Node-модуля. Доступна интегрирация Lighthouse в системы непрерывной интеграции
- Из веб-интерфейса. Или просто запустите Lighthouse и делайте ссылки на отчеты, не устанавливая ничего.
Lighthouse является инструментом веб-разработчика и создан для специалистов. Разобраться в нём самостоятельно, а уж тем более сделать на основании его анализа корректные выводы, довольно сложно. Но если использовать его исключительно для получения данных — то с этим справиться каждый.
Запустить Lighthouse в DevTools
Аудит Lighthouse можно выполнить в DevTools. Чтобы выполнить проверку необходимо осуществить ряд простых действий:
- Загрузить Google Chrome
- Перейти по нужному URL
- Открыть DevTools
- Нажать вкладку Аудит
- Нажать «Выполнить аудит» и оставить включёнными все списки
- Нажать «Запустить аудит»
Спустя минуту-полторы инструмент выдаст все доступные данные по странице.
Запуск из командной строки Node
Для установки модуля Node Откройте Google Chrome
- Установите текущую версию Node
- Установите Lighthouse. Тег -g устанавливает его в качестве глобального модуля
Для запуска аудита задайте:
lighthouse <url>
Чтобы посмотреть варианты аудита необходимо задать:
lighthouse —help
Также можно запустить Lighthouse программно в качестве модуля Node.
Как просматривать отчёты Lighthouse и поделиться ими онлайн
Для того, чтобы просматривать отчёты и публиковать их онлайн, необходимо воспользоваться инструментом Lighthouse Viewer. Сделать это можно в формате JSON. Экспорт будет зависеть от того, каким именно образом вы используете Lighthouse.
- Chrome DevTools . Нажмите «Скачать отчет»
- Командная строка . Задайте:lighthouse —output json —output-path <path/for/output.json>
- Расширение Chrome. Нажмите «Экспорт» > Сохранить как JSON
Чтобы посмотреть данные потребуется открыть Свойства просмотра отчётов. Перетащить в него файл JSON и щёлкнуть по любому месту, чтобы открыть навигатор выбора файлов.
Помимо этого, отчётами можно делиться и как секретными списками GitHub. Таким образом, вы сможете бесплатно контролировать все доступные вам версии.
