Измените язык, если вам нужно работать с Топвизором на другом языке. Язык интерфейса можно изменить в любое время в настройках аккаунта. Измените язык, если вам нужно работать с Топвизором на другом языке. ru Русский Выбрать

Как улучшить значение FID в Core Web Vitals

Что такое First Input Delay, что на самом деле измеряет метрика и как её улучшить.

Канал Google Search Central выпустил видео о том, как улучшить FID.

FID – это показатель, который оценивавает в миллисекундах, сколько времени нужно вашему сайту, чтобы дать реакцию на первое взаимодействие пользователя с контентом. Например, когда он кликает по кнопке или нажимает на поле ввода текста. FID измеряет время задержки до начала обработки данных, а не время фактической обработки этих данных.

Что измеряет FID в Core Web Vitals
Что измеряет FID в Core Web Vitals

Как и любая метрика в Page Experience, FID измеряется для каждого URL отдельно, основываясь непосредственно на опыте реальных пользователей, которые заходят на сайт. Каждый URL оценивается независимо от всех остальных страниц. Например, главная страница может иметь превосходные показатели, но страница товара или статьи будет далека от идеала.

Показатели, которые вы видите при измерении FID, транслируют опыт реальных пользователей. Показатели FID для сайта поступают из ежемесячного отчёта Chrome User Experience (CrUX).

Подробнее про отчёт Chrome User Experience

Узнать показатели своей страницы можно в инструменте PageSpeed Insights.

У страниц будут хорошие показатели FID, если как минимум у 75 % пользователей задержка действия будет менее 100 мс. Любой показатель от 100 до 300 мс даёт понять, что у вас есть проблема. Выше 300 мс – плохо.

Уточнение

Необязательно, что в вашем отчёте будет значение метрики FID. Почему?

FID основана на взаимодействии пользователя со страницей. Если на вашей странице нет ничего интерактивного или люди никогда не нажимают кнопки на ней и не пытаются ничего ввести, то данные для FID просто отсутствуют.

Если страницы новые или ваши URL-адреса не были включены в отчёт CrUX, вы всё равно можете отследить результаты по FID, но потребуется чуть больше усилий.

Мы можем вычислить FID, используя API. Для этого нужно добавить немного JavaScript на страницу.

Статья на web.dev на русском языке: Как измерить FID в JavaScript

Что делать, чтобы улучшить показатели

1. Удалить лишний JavaScript или выполнить его загрузку в фоновом режиме.

Проверьте, не загружается ли у вас слишком много JavaScript – больше 200 кб. Если это так, подумайте над тем, чтобы разделить код на более маленькие части (отдельные файлы).

Загрузку любого некритичного для страницы кода можно выполнить в фоновом режиме, используя атрибуты async или defer.

2. Отслеживать время задержки взаимодействия с отдельными элементами страницы. Чаще всего первое взаимодействие пользователя связано с элементом, который находится вверху страницы. Например, кнопка меню или поле поиска. Если вы не понимаете, из-за чего у вашей метрики FID низкие показатели, проверьте каждый элемент в отдельности.

3. Разбить длительные задачи. Любой фрагмент кода, который блокирует основной поток на 50 мс или более, можно рассматривать как длительную задачу. Chrome DevTools визуализирует длительные задачи на панели Performance.

Отслеживать их можно и через Long Tasks API.

Подробнее о способах оптимизации FID