Web Vitals — это инициатива Google, направленная на предоставление унифицированных рекомендаций по сигналам качества веб-страниц, которые необходимы для обеспечения удобства работы пользователей в Интернете. Его цель — упростить широкий спектр доступных инструментов измерения производительности и помочь владельцам сайтов сосредоточиться на наиболее важных показателях — основных веб-показателях .
Основные веб-показатели
Основные веб-показатели — это подмножество веб-показателей, которые применяются ко всем веб-страницам, должны измеряться всеми владельцами сайтов и отображаются во всех инструментах Google. Каждый из основных веб-показателей представляет собой отдельный аспект пользовательского опыта, поддается измерению в полевых условиях и отражает реальный опыт достижения критического, ориентированного на пользователя результата.
Метрики, составляющие основные веб-показатели, со временем будут меняться . Текущий набор фокусируется на трёх аспектах пользовательского опыта: загрузке , интерактивности и визуальной стабильности . Он включает в себя следующие показатели:
- Самая большая краска по содержанию (LCP) : измеряет производительность загрузки . Чтобы обеспечить хорошее взаимодействие с пользователем, LCP должен произойти в течение 2,5 секунд после первого начала загрузки страницы.
- Первая задержка ввода (FID) : измеряет интерактивность . Чтобы обеспечить хорошее взаимодействие с пользователем, страницы должны иметь FID 100 миллисекунд или меньше.
- Совокупный сдвиг макета (CLS) : измеряет визуальную стабильность . Чтобы обеспечить хорошее взаимодействие с пользователем, must должен поддерживать CLS 0,1. или менее.
Для каждого из этих показателей, чтобы гарантировать достижение рекомендуемой цели для большинства ваших пользователей, хорошим порогом для измерения является 75-й процентиль загрузки страниц, сегментированный по мобильным и настольным устройствам.
Инструменты, которые оценивают соответствие Core Web Vitals, должны считать страницу соответствующей, если она соответствует рекомендуемым целевым показателям на уровне 75-го процентиля для каждого из этих трех показателей.
Жизненный цикл
Метрики на треке Core Web Vitals проходят жизненный цикл, состоящий из трех этапов: экспериментальный, ожидающий и стабильный.
Каждый этап предназначен для того, чтобы сигнализировать разработчикам, как им следует думать о каждой метрике:
- Экспериментальные метрики — это перспективные основные веб-показатели, которые все еще могут претерпевать значительные изменения в зависимости от тестирования и отзывов сообщества.
- Ожидающие метрики — это будущие основные веб-показатели, которые прошли стадию тестирования и обратной связи и имеют четко определенные сроки, чтобы стать стабильными.
- Стабильные метрики — это текущий набор основных веб-показателей, которые Chrome считает необходимыми для обеспечения хорошего пользовательского опыта.
Основные веб-показатели находятся на следующих стадиях жизненного цикла:
- ЛКП : Стабильный
- ПИД : Стабильный
- CLS : Стабильный
- Взаимодействие со следующей отрисовкой (INP) : Ожидается
Дополнительные сведения о разработке INP см. в разделе «Продвижение взаимодействия к следующей отрисовке» .
Экспериментальный
Когда метрика изначально разрабатывается и попадает в экосистему, она считается экспериментальной метрикой .
Цель экспериментального этапа — оценить пригодность метрики, сначала исследуя проблему, которую необходимо решить, и, возможно, повторяя то, что предыдущие метрики, возможно, не смогли решить. Например, INP изначально разрабатывался как экспериментальный показатель для более комплексного решения проблем производительности во время работы Интернета, чем задержка первого ввода (FID) .
Экспериментальная фаза жизненного цикла Core Web Vitals также призвана обеспечить гибкость при разработке метрики за счет выявления ошибок и даже изучения изменений в ее первоначальном определении. Это также этап, на котором обратная связь от сообщества наиболее важна.
В ожидании
Когда команда Chrome определяет, что экспериментальная метрика получила достаточную обратную связь и доказала свою эффективность, она становится метрикой, ожидающей рассмотрения . Ожидаемые показатели сохраняются на этом этапе в течение как минимум шести месяцев, чтобы дать экосистеме время на адаптацию. Отзывы сообщества остаются важным аспектом этого этапа, поскольку все больше разработчиков начинают использовать эту метрику.
Стабильный
Когда метрика-кандидат Core Web Vital доработана, она становится стабильной метрикой . Именно тогда метрика может стать ключевым веб-важным фактором.
Стабильные метрики активно поддерживаются, и в них могут быть исправлены ошибки и изменены определения. Стабильные показатели Core Web Vitals не будут меняться чаще одного раза в год. Любые изменения в Core Web Vital будут четко указаны в официальной документации метрики, а также в журнале изменений метрики. Основные веб-показатели также включаются в любые оценки.
Ключевой момент: стабильные показатели не обязательно постоянны. Стабильную метрику можно удалить и заменить другой метрикой, которая более эффективно решает проблемную область.
Измеряйте и формируйте отчеты об основных веб-показателях
Google считает, что основные веб-показатели имеют решающее значение для любого опыта работы в Интернете. В результате компания стремится отображать эти показатели во всех своих популярных инструментах . В следующих разделах подробно описано, какие инструменты поддерживают Core Web Vitals.
Полевые инструменты для измерения основных веб-показателей
В отчете об опыте пользователей Chrome собираются анонимные реальные данные измерений пользователей для каждого основного веб-показателя. Эти данные позволяют владельцам сайтов быстро оценить их эффективность, не требуя ручной настройки аналитики для своих страниц, а также используются в таких инструментах, как PageSpeed Insights и отчете Core Web Vitals в Search Console.
| ЛКП | ПИД | ЦЛС | |
| Отчет об опыте использования Chrome | |||
| Статистика PageSpeed | |||
| Search Console (отчет «Основные веб-показатели») |
Данные, предоставленные отчетом об опыте работы пользователей Chrome, предлагают быстрый способ оценить производительность сайта, но они не предоставляют подробную телеметрию по просмотрам страниц, которая часто необходима для точной диагностики, мониторинга и быстрого реагирования на регрессии. В результате мы настоятельно рекомендуем сайтам настроить собственный мониторинг реальных пользователей.
Измерение основных веб-показателей с помощью JavaScript
Каждый из основных веб-показателей можно измерить в JavaScript с использованием стандартных веб-API.
Самый простой способ измерить все основные веб-показатели — использовать библиотеку JavaScript web-vitals , небольшую, готовую к использованию оболочку API, которая измеряет каждую метрику способом, который точно соответствует тому, как о них сообщают инструменты Google.
С помощью библиотеки web-vitals измерение каждой метрики так же просто, как вызов одной функции (полное описание использования и подробную информацию об API см. в документации):
import {onCLS, onFID, onLCP} from 'web-vitals';
function sendToAnalytics(metric) {
const body = JSON.stringify(metric);
// Use `navigator.sendBeacon()` if available, falling back to `fetch()`.
(navigator.sendBeacon && navigator.sendBeacon('/analytics', body)) ||
fetch('/analytics', {body, method: 'POST', keepalive: true});
}
onCLS(sendToAnalytics);
onFID(sendToAnalytics);
onLCP(sendToAnalytics);
После того, как вы настроите свой сайт для использования библиотеки Web-Vitals для измерения и отправки данных Core Web Vitals в конечную точку аналитики, следующим шагом будет агрегирование этих данных и составление отчета по ним, чтобы увидеть, соответствуют ли ваши страницы рекомендуемым пороговым значениям как минимум в течение 75% посещений страниц.
Хотя некоторые поставщики аналитики имеют встроенную поддержку показателей Core Web Vitals, даже те, у которых ее нет, должны включать базовые функции настраиваемых показателей, которые позволяют измерять Core Web Vitals в их инструменте.
Одним из примеров этого является отчет о веб-показателях , который позволяет владельцам сайтов измерять свои основные веб-показатели с помощью Google Analytics. Рекомендации по измерению основных веб-показателей с помощью других инструментов аналитики см. в разделе «Рекомендации по измерению веб-показателей на местах» .
Вы также можете создавать отчеты по каждому из основных веб-показателей без написания кода, используя расширение Chrome Web Vitals . Это расширение использует библиотеку web-vitals для измерения каждого из этих показателей и отображения их пользователям при просмотре веб-страниц.
Это расширение может быть полезно для понимания эффективности ваших собственных сайтов, сайтов ваших конкурентов и Интернета в целом.
| ЛКП | ПИД | ЦЛС | |
|---|---|---|---|
| веб-виталы | |||
| Расширение веб-показателей |
Разработчики, которые предпочитают измерять эти метрики напрямую с помощью базовых веб-API, могут вместо этого использовать эти руководства по метрикам для получения подробной информации о реализации:
Дополнительные рекомендации по измерению этих показателей с помощью популярных аналитических служб или собственных инструментов аналитики см. в разделе «Рекомендации по измерению веб-показателей на местах» .
Лабораторные инструменты для измерения основных веб-показателей
Хотя все основные веб-показатели являются, в первую очередь, показателями на местах, многие из них также поддаются измерению в лаборатории.
Лабораторные измерения — лучший способ проверить производительность функций во время разработки. Это также лучший способ обнаружить снижение производительности до того, как оно произойдет.
Следующие инструменты можно использовать для измерения основных веб-показателей в лабораторной среде:
| ЛКП | ПИД | ЦЛС | |
|---|---|---|---|
| Инструменты разработчика Chrome | (вместо этого используйте TBT ) | ||
| Маяк | (вместо этого используйте TBT ) |
Такие инструменты, как Lighthouse, которые загружают страницы в моделируемой среде без участия пользователя, не могут измерить FID, поскольку в них нет пользовательского ввода. Однако показатель общего времени блокировки (TBT) поддается измерению в лаборатории и является отличным показателем FID. Оптимизация производительности, которая улучшает TBT в лаборатории, должна улучшить FID в полевых условиях. Дополнительные рекомендации см. в разделе Рекомендации по улучшению результатов .
Хотя лабораторные измерения являются важной частью предоставления отличных впечатлений, они не заменяют измерения в полевых условиях. Производительность сайта может сильно различаться в зависимости от возможностей устройства пользователя, условий его сети, других процессов, которые могут выполняться на устройстве, и того, как они взаимодействуют со страницей. Фактически, на оценку каждого из показателей Core Web Vitals может влиять взаимодействие с пользователем. Только полевые измерения могут точно отразить полную картину.
Рекомендации по улучшению ваших результатов
Следующие руководства предлагают конкретные рекомендации по оптимизации страниц для каждого из основных веб-показателей:
Другие важные веб-показатели
Хотя основные веб-показатели являются важнейшими показателями для понимания и обеспечения отличного пользовательского опыта, существуют и другие важные показатели.
Эти другие веб-показатели часто служат прокси или дополнительными показателями для основных веб-показателей, помогая охватить большую часть опыта или помочь в диагностике конкретной проблемы.
Например, время до первого байта (TTFB) и первая отрисовка содержимого (FCP) являются жизненно важными аспектами процесса загрузки , и оба они полезны при диагностике проблем с LCP (медленное время ответа сервера или ресурсы, блокирующие рендеринг , соответственно).
Аналогичным образом, такой показатель, как общее время блокировки (TBT), является жизненно важным лабораторным показателем для выявления и диагностики потенциальных проблем с интерактивностью , которые могут повлиять на FID и INP. Однако он не является частью набора основных веб-показателей, поскольку его невозможно измерить на местах и он не отражает результат, ориентированный на пользователя .
Изменения в веб-показателях
Web Vitals и Core Web Vitals представляют собой лучшие доступные сегодня сигналы для измерения качества взаимодействия в Интернете, но эти сигналы не идеальны, и следует ожидать будущих улучшений или дополнений.
Основные веб-показатели актуальны для всех веб-страниц и представлены в соответствующих инструментах Google. Поскольку изменения в этих показателях имеют далеко идущие последствия, разработчикам следует ожидать стабильности определений и пороговых значений основных веб-показателей, а также предварительного уведомления и предсказуемого графика обновлений.
Другие веб-показатели часто зависят от контекста или инструмента и могут быть более экспериментальными, чем основные веб-показатели. Таким образом, их определения и пороговые значения могут меняться с большей частотой.
Изменения всех веб-показателей документируются в этом общедоступном журнале изменений.