INP

INP (Interaction to Next Paint, задержка до следующей отрисовки) — метрика Core Web Vitals, которая показывает, как быстро страница реагирует на действия пользователя: клик, касание экрана или нажатие клавиши. INP учитывает взаимодействия за весь визит и берет одно из самых медленных. Хороший результат — до 200 миллисекунд. Если INP выше, человек нажимает кнопку, а страница «думает»: он жмет повторно, уходит или не доходит до заказа.

Главное об INP:

С 12 марта 2024 года INP заменил FID в Core Web Vitals и учитывается Google в ранжировании.
Измеряется на реальных пользователях, оценка — по 75% визитов.
Главная причина плохого INP — тяжелый JavaScript, который занимает браузер.
Прокрутка и наведение мыши в INP не входят, считаются клики, касания и нажатия клавиш.

Пороговые значения

Значение INP	Оценка	Что чувствует пользователь
до 200 мс	Хорошо	Страница реагирует мгновенно
200–500 мс	Требует улучшения	Заметная задержка, интерфейс кажется медленным
более 500 мс	Плохо	Ощущение, что сайт завис, повторные нажатия

Из чего складывается INP

Этап	Что происходит	Что его затягивает
Задержка ввода	Браузер занят и не может сразу начать обработку	Длинные задачи JavaScript, загрузка скриптов
Обработка	Выполняются обработчики события	Тяжелый код в обработчике клика
Отрисовка	Браузер пересчитывает верстку и рисует новый кадр	Большой DOM, сложные стили, массовые изменения страницы

Сумма трех этапов и есть задержка одного взаимодействия. INP за визит — самая медленная из них; при большом числе взаимодействий единичные выбросы отбрасываются.

INP и FID: в чем разница

	FID (до марта 2024)	INP (с марта 2024)
Какие взаимодействия	Только первое	Все за визит
Что измеряет	Только задержку ввода	Полный путь: ввод, обработку, отрисовку
Хорошее значение	до 100 мс	до 200 мс
Насколько честно отражает опыт	Слабо: большинство сайтов проходили	Строже: видны проблемы при работе с фильтрами, корзиной, меню

Частые причины плохого INP

Длинные задачи JavaScript — дольше 50 мс без перерыва — блокируют реакцию на клики.
Сторонние скрипты: чаты, виджеты, счетчики, рекламные коды, A/B-тесты.
Тяжелые фильтры и сортировка в каталоге, которые перерисовывают весь список.
Большой DOM — тысячи элементов на странице.
Обработчики, которые сначала выполняют всю работу и только потом показывают реакцию.
Слабые смартфоны: на них та же страница в несколько раз медленнее, чем на компьютере.

Как улучшить INP

Найдите медленные взаимодействия по реальным данным: Search Console, PageSpeed Insights или собственный сбор через web-vitals.
Воспроизведите их в Chrome DevTools на вкладке Performance с замедлением процессора.
Разбейте длинные задачи на короткие части, чтобы браузер успевал обрабатывать клики.
Показывайте реакцию сразу — нажатое состояние кнопки, индикатор загрузки — а тяжелую работу выполняйте следом.
Отложите или уберите лишние сторонние скрипты, загружайте их после основного контента.
Уменьшите DOM: подгружайте длинные списки частями, не держите скрытые копии меню и блоков.
Проверьте результат на реальных данных через 28 дней — столько нужно, чтобы обновились полевые метрики.

Где измерить INP

Инструмент	Тип данных	Для чего
Google Search Console	Полевые	Какие группы страниц не проходят порог
PageSpeed Insights	Полевые и лабораторные	INP конкретной страницы и рекомендации
Chrome DevTools, Performance	Лабораторные	Разбор конкретного клика по этапам
Библиотека web-vitals	Полевые	Сбор INP с реальных пользователей в свою аналитику
Lighthouse	Лабораторные	Косвенно через общее время блокировки (TBT)

Частые вопросы

Почему Lighthouse не показывает INP?

Lighthouse тестирует загрузку страницы без действий пользователя, поэтому INP он измерить не может. Близкий лабораторный показатель — общее время блокировки (Total Blocking Time): чем он меньше, тем ниже риск плохого INP.

Влияет ли INP на позиции в Яндексе?

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

Какие страницы чаще всего проваливают INP?

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