Используя решение для мониторинга веб-сайта Dotcom-Monitor, можно автоматически создавать и настраивать устройство мониторинга Lighthouse Report (решение для мониторинга Web Page) для аудита производительности, оптимизации поисковой системы (SEO) и других метрик веб-сайта.

Что такое маяк Google?

Google Lighthouse — это автоматизированный инструмент с открытым исходным кодом для аудита скорости и производительности веб-сайта. Он проверяет время загрузки, доступность, SEO веб-страниц, прогрессивных веб-приложений, а также расширенный список лучших практик. Маяк был включен в PageSpeed Insights (PSI), и теперь пользователи могут рассматривать отчеты о данных о производительности. Кроме того, PageSpeed Insights использует комбинацию лабораторных и реальных данных, в то время как Lighthouse использует только лабораторные данные для создания отчетов.

Метрики PageSpeed Insights помогают получить представление о восприятии пользователем скорости веб-страницы, что стало фактором для рейтинга SEO. Однако, как важно, как это стремиться к большой балл Маяк, который мы покрываем больше в этой статье ниже, что важно, что вы делаете с этими рекомендациями Маяк для улучшения производительности веб-страницы за счет уменьшения воспринимается и фактическое время загрузки веб-страницы.

Маяк имитирует загрузку веб-страницы в реальном браузере в реальных условиях (потерянные пакеты, плохое подключение и т.д.) и генерирует отчет с оценками, отражающими показатели аудита. Кроме того, в докладе содержатся предложения о том, как повысить скорость и производительность сайта. Помимо отдельных тестов, отчеты Lighthouse могут быть чрезвычайно полезны в веб-разработке для сравнения изменений в результатах с течением времени.

Однако, когда дело доходит до повторяющихся тестирования веб-сайта, запуск Маяк вручную на каждом тестовом случае, кажется, не является эффективным. В этой статье мы обсудим способ автоматического выполнения аудита с помощью Dotcom-Monitor.

Как более эффективно использовать отчет о маяке

Каждый раз, когда вы улучшаете контент веб-страницы в соответствии с требованиями SEO, вам может потребоваться отслеживать изменения в оценках SEO до и после улучшений. В случае SEO, одно разовая проверка не будет иметь смысла. Как раз наоборот. Необходимо следить за тем, как SEO оценки меняются с течением времени и на регулярной основе.

Допустим, вы хотите получить представление о влиянии обновлений веб-страниц на показатели производительности без необходимости вручную извлекать отчеты для каждой версии. Кроме того, иногда оптимизация функциональности веб-сайта может повлиять на определенную метрику производительности. Например, если вы работаете над сокращением времени, необходимого для загрузки контента на веб-странице, необходимо сосредоточиться на изменениях в оценках First Contentful Paint или First Meaningful Paint и убедиться, что оценка не упадет. Мы обсудим эти показатели более подробно в этой статье.

Настройка отчета маяка с помощью Dotcom-Monitor

Dotcom-Monitor может генерировать отчет Lighthouse с указанной частотой для мониторинга изменений в конкретной метрике веб-страницы. Ключевой особенностью решения является мониторинг конкретной метрики аудита. Вы можете выбрать метрику и установить порог ошибки для получения уведомлений, когда контролируемый балл находится вне приемлемого диапазона. Кроме того, можно настроить оповещение об ошибках, которые произошли во время времени работы Маяка, указать планировщик аудита и настроить запланированную отчетность о результатах мониторинга.

После настройки устройства мониторинга можно вытащить отчеты Lighthouse из отчета Dotcom-Monitor Online.

Настройка аудита отчетов маяка

Url

Введите URL-адрес, который вы хотите провести аудит с помощью Lighthouse. Адрес URL должен быть сформирован точно так же, как вы бы использовать его в браузере, таких как http://www.example.com. Вы должны включить http:// https:// или данные в начале адреса. В это время вы также можете включить любые параметры GET в конце URL-адреса.

Маяк Доклад Метрика

Dotcom-Monitor позволяет осуществлять мониторинг и оповещение по конкретной метрике аудита веб-страниц. Система будет отслеживать выбранные метрические баллы в отчете Маяка. Если указан порог ошибки для метрики и выбран вариант ошибок оповещения об ошибках Маяка, устройство будет считаться несостоявшимся в тех случаях, когда оценка интереса выходит за пределы допустимых диапазонов. Для получения уведомлений настройте оповещения для устройства на вкладке Оповещения экрана редактирования устройства.

Также можно настроить запланированные отчеты, которые будут агрегировать результаты выбранного мониторинга метрик на основе ежедневной, еженедельной или ежемесячной статистики. Выберите одну метрику аудита из следующих метрик Маяка для получения оповещений и отчетов. Отчет о производительности включает в себя различные метрики, и мы обсудим каждую из этих метрик ниже.

Общий балл производительности

Общий балл производительности является средневзвешенной по всем показателям производительности. Более взвешенные метрики имеют большее влияние на общий балл производительности.

Первая содержимая краска

First Contentful Paint (FCP) измеряет, сколько времени требуется браузеру для визуализации первой части содержимого DOM после того, как пользователь переходит на вашу страницу. Хороший первый Contentful Paint оценка ничего под одну секунду. Важно отличать First Contentful Paint от термина First Paint. Во-первых, Paint – это когда что-либо считается визуализированным, что может быть так же просто, как цвет фона самой страницы, но он не предоставляет никакого соответствующего контента или информации, которую пользователь пришел, чтобы использовать или действовать.

Первая Contentful Paint — это контент, который доставляется или раскрашивается пользователю. Для большинства веб-страниц это, как правило, содержимое верхней части страницы, например, меню навигации или главное изображение. Это будут первые фрагменты фактического контента, которые пользователи увидят при загрузке страницы. First Contentful Paint предоставляет более полезную реальную точку данных, чем First Paint.

Индекс скорости

Индекс скорости показывает, как быстро заметно заполняется содержимое страницы. Индекс скорости определяется путем измерения скорости веб-страницы и сравнения этого с данными с других веб-сайтов. Чем ниже оценка индекса скорости, тем лучше производительность. Любая страница, которая длится менее 4,3 секунды, считается хорошей и будет обозначена зеленой цветовой кодировкой. Скорость страницы между 4,4 и 5,8 считается умеренной скоростью и будет обозначена оранжевым цветом. Наконец, скорость страницы в течение 5,8 секунд считается медленной и будет указана красным цветом.

Время интерактивного

Время интерактивного, или TTI, измеряет время от начала загрузки страницы до загрузки основных суб-ресурсов, и она способна быстро реагировать на пользовательский ввод. Разумное время интерактивного менее пяти секунд. Одно важное замечание о Time to Interactive заключается в том, что вы хотите, чтобы пользователи могли взаимодействовать с вашим сайтом, когда содержимое страницы, такое как кнопки или ссылки, становится видимым. Цель состоит в том, чтобы сделать время между первой содержимой краски и время для интерактивного как можно короче. Если ваша страница настроена для обслуживания этого содержимого, но она не является интерактивной до тех пор, пока сценарий не загружен, это может привести к тому, что некоторые пользователи будут раздражены.

Первая значимая краска

Первая значимая краска (FMP) измеряется, когда основное содержимое страницы видно. Первая значимая краска — это время между началом загрузки страницы и отображением первичного сгиба. First Meaningful Paint измеряется так же, как First Contentful Paint, которая забита с реальной производительности данных веб-сайта. В зависимости от того, как страница настроена на загрузку, First Meaningful Paint и First Contentful Paint могут иметь одинаковую оценку, однако в случаях, когда используется, например, встроенный фрейм (iframe), время будет разным. Время менее двух секунд считается быстрым и будет указано зеленым цветом. Все, что от двух до четырех секунд является умеренным и будет указано оранжевым цветом. Наконец, все, что в течение четырех секунд медленно и будет указано красным цветом.

Первый процессор холостого хода

Первый процессор Idle отмечает первый случай, когда основной поток страницы достаточно тише для обработки входных данных. Можно считать время между загрузкой страницы и моментом ее загрузки. Эта оценка, как и другие в этом списке, определяется путем сравнения вашей страницы с данными с других веб-сайтов. Хороший первый CPU Idle оценка в любое время под 4,7 секунды и будет указано зеленым цветом. Каждый раз между 4,8 и 6,5 секунд умеренно быстро и будет указано в оранжевом цвете. Наконец, любое время в течение 6,5 секунд медленно и будет указано красным цветом.

Максимальная потенциальная первая задержка ввода

Максимальная потенциальная первая задержка ввода — это продолжительность, в миллисекундах, самого длинного выполнения устройства, которое могут испытать пользователи. Другими словами, это количество времени, которое требуется браузеру, чтобы ответить на действия пользователя, такие как нажатие на ссылку или кнопку, и обработка этого действия. Быстрая максимальная потенциальная первая задержка ввода составляет менее 130 миллисекунд и будет указана зеленым цветом. Все, что более 250 миллисекунд считается медленным и будет указано красным цветом.

Общий балл доступности

Доступность Общий счет

выделить

возможности

для улучшения доступности вашего сайта.

Речь идет не только об обеспечении доступности для пользователей с ограниченными возможностями. Даже самые маленькие исправления, такие как makin

g уверен, что HTML элементы

под названием правильно и реализованы

может пойти длинный путь для обеспечения доступности

для всех пользователей

посадки на веб-страницах.

 

Лучшие практики Общий балл

Общий балл передового опыта гарантирует, что ваша страница будет следовать лучшим практикам отрасли, таким как действительный JavaScript, размеры изображений, шифрование и многое другое. В этом разделе также содержится обзор различных элементов, которые прошли или не прошли аудит Маяка, а также рекомендации

SEO Общий счет

Общие оценки SEO гарантируют, что ваша страница оптимизирована для ранжирования результатов поиска. Например, аудит Lighthouse покажет, что для указанной страницы есть релевантные заголовки, метаописания, успешные коды состояния и многое другое. Этот раздел также включает в себя пункты, которые не отвечают критериям аудита и должны быть рассмотрены для SEO улучшения и оптимизации.

Порог ошибки

Установите приемлемый диапазон баллов для выбранной метрики. Если оценка находится за пределами диапазона, устройство будет помечено как неудачное. Для получения оповещений в зависимости от установленного порога выберите Да в поле оповещения об ошибках Маяка.

Параметры DNS

Функция DNS Options позволяет пользователям выбирать, как запросы сервера доменных имен (DNS) проводятся во время выполнения задачи мониторинга.

Чтобы указать режим разрешения имен хостов в разделе Режим решения DNS, выберите один из доступных режимов. Для получения более подробной информации о конфигурации функции см.

Раздел Custom DNS Hosts позволяет настроить сопоставление IP-адресов с именами хостов. Поддерживается разрешение DNS IPv6 и IPv4.

Чтобы указать сопоставление, введите IP-адрес и имя хоста в соответствующие поля.

Примеры:

192.168.107.246 example.com user.example.com userauth.example.com tools.example.com
192.168.107.246 example.com
192.168.107.246 user.example.com
192.168.107.246 userauth.example.com

Смотрите также: Параметры режима DNS.

 

Автоматизация мониторинга маяка для улучшения пользовательского опыта

Важно понимать, что скорость страницы и время загрузки страницы, хотя и тесно связаны, следует рассматривать как отдельные факторы, когда дело доходит до производительности веб-сайта. В то время как время загрузки страницы сосредоточено на измерении того, сколько времени требуется для всех веб-страниц для визуализации, что является фактором, когда дело доходит до предоставления большой пользовательский опыт, пользователи не ждут ваших веб-страниц, чтобы полностью загрузить до навигации, нажав, или принимая их следующее действие (ы).

Отчеты мониторинга Маяк позволяют постоянно оценивать и отслеживать, насколько хорошо ваши веб-страницы работают с течением времени и обеспечить ваши страницы отвечают показателям производительности, пороги, и передовой практики, установленные PageSpeed Исследования, давая вам душевное спокойствие, что ваши клиенты и пользователи получают быстрый опыт работы в Интернете независимо от того, где они находятся.

Дополнительные ресурсы по метрике маяка

Для более подробного описания метрик Маяка посетите следующие страницы:

https://developers.google.com/web/tools/lighthouse

https://web.dev/performance-scoring/