INP (Interaction to Next Paint) — это метрика Core Web Vitals, которая простыми словами показывает, насколько быстро страница реагирует на действия пользователя. Google анонсировал её в мае 2022 года, а 12 марта 2024 года официально заменил ею FID в составе CWV.
Замер охватывает все клики, тапы и нажатия клавиш за сессию, а итоговое значение берётся по 75-му перцентилю в отчёте CrUX. Хорошая отзывчивость интерфейса — это INP до 200 мс; значения выше 500 мс Search Console помечает как Poor.
§ 01Как считается
Алгоритм фиксирует задержку между взаимодействием и следующей отрисовкой кадра для каждого input-события. Из всех замеров за визит выбирается худший (или 98-й перцентиль при 50+ взаимодействиях), а затем по 75-му перцентилю пользователей формируется значение для домена. Что это значит на практике: один зависший клик при открытии меню способен испортить отчёт CrUX за 28 дней.
§ 02Зачем нужно
FID учитывал только первое касание и игнорировал тяжёлые обработчики после загрузки. Interaction to Next Paint закрывает эту дыру: метрика отражает реальную плавность работы SPA, форм оформления заказа и фильтров каталога. Для чего нужно бизнесу — Deloitte в 2020 году показал рост конверсии на 8,4% при ускорении мобильных страниц на 0,1 с, и INP напрямую завязан на эту динамику.
INP 412 → 168 мс — Интернет-магазин одежды на Shopify Plus отложил сторонние скрипты чата и аналитики через requestIdleCallback, разбил длинные задачи фильтра каталога. INP по CrUX-75th упал с 412 до 168 мс за 8 недель. Замер через PageSpeed Insights и web-vitals.js, конверсия мобильного трафика выросла на 9%.
INP −58% за 10 нед — B2B SaaS-дашборд аналитики на React 18 заменил тяжёлый onChange в фильтрах на debounce 150 мс и перевёл рендер таблиц в useTransition. INP по полевым данным снизился с 290 до 122 мс за 10 недель. Контроль через Sentry Performance и Chrome UX Report.
§ 03Как измерить
Полевые данные смотрят в PageSpeed Insights, отчёте Core Web Vitals в Search Console и публичном датасете CrUX на BigQuery. Лабораторно отзывчивость интерфейса проверяют через Lighthouse 11+, панель Performance в Chrome DevTools и библиотеку web-vitals.js от Google. Для постоянного мониторинга подключают RUM-сервисы: SpeedCurve, DebugBear, Vercel Speed Insights.
§ 04Что делать дальше
Оптимизация INP начинается с разбиения долгих задач JavaScript: используйте scheduler.yield() и requestIdleCallback, выносите аналитику в Web Worker. Илья Гусаров рекомендует в первую очередь чистить сторонние теги — GTM, чаты, A/B-тесты часто дают задержку 300–800 мс. Дальше — дебаунс обработчиков, ленивая гидрация React-компонентов и замена синхронных layout-операций на CSS content-visibility.