INP Наказывает за Тяжёлую Аналитику: Почему Ваш Трекер Работает в Главном Потоке
Interaction to Next Paint — это Core Web Vital, который чаще всего не проходят сайты, и данные с реальных устройств показывают, что скрипты поведенческого трекинга — одна из главных причин. Решение — отправлять меньше работы в главный поток.
Interaction to Next Paint (INP) — это Core Web Vital, который разработчики проваливают чаще всего, и причина находится в вашем <head>. INP стал стабильным Core Web Vital в 2024 году, заменив First Input Delay, и измеряет то, что FID никогда не мог: насколько отзывчивой остаётся страница при каждом клике, тапе и нажатии клавиши на протяжении всего её жизненного цикла.
Метрика беспощадна к тому виду JavaScript, который тащит за собой слежечная аналитика. Если ваш трекер выполняет существенную работу в главном потоке, каждое взаимодействие ваших пользователей наследует эту цену.
Что INP Действительно Измеряет
INP сообщает о задержке взаимодействий на уровне 75-го перцентиля всех кликов, тапов и нажатий клавиш на странице. Значение 200 мс или меньше — «хорошо»; от 200 до 500 мс — «требует улучшения»; выше 500 мс — «плохо».
Каждое взаимодействие делится на три фазы:
- Задержка ввода (input delay) — время до того, как ваши обработчики событий вообще смогут начать работу, потому что главный поток занят.
- Длительность обработки — время, которое требуется коллбэкам ваших обработчиков на выполнение.
- Задержка отрисовки (presentation delay) — время от завершения коллбэка до отрисовки браузером следующего кадра.
Тяжёлая аналитика вредит всем трём фазам. Трекер, который парсит большой бандл, вычисляет логику согласия, группирует очередь тег-менеджера или читает layout для построения отпечатка, занимает главный поток именно тогда, когда пользователь пытается взаимодействовать.
Длинные Задачи — Это Механизм
Браузер не может обработать взаимодействие, пока выполняется задача. Любая задача длительностью более 50 мс — это длинная задача, и часть сверх 50 мс — это мёртвое время, в течение которого клики копятся в очереди.
Тег-менеджер, который синхронно загружает и выполняет десяток вендорских скриптов, порождает каскад длинных задач. Пользователь кликает, ничего не происходит, кликает снова — и когда главный поток наконец освобождается, накопленные вводы срабатывают все разом.
Это не теория. Web Almanac 2024 от HTTP Archive обнаружил, что страницы со скриптами поведенческого трекинга — session replay, тепловые карты, поведенческая аналитика — достигали хорошего INP лишь в 37% случаев на мобильных, против 60% на десктопе. Скрипты управления согласием — баннеры, которые требуют эти инструменты, — проходили INP лишь на 53% мобильных страниц. Инструментирование, призванное «понимать пользователей», активно ухудшает их опыт.
Архитектура, Которая Этого Избегает
Решение структурное, а не флаг, который вы переключаете. Отправляйте меньше кода и держите его вне критического пути.
Privacy-first трекер может быть достаточно маленьким, чтобы его парсинг и выполнение никогда не регистрировались как длинная задача. Трекер Monoid весит около 2 КБ, не имеет зависимостей, не ставит cookie и не читает layout — поэтому нечего отпечатывать и нечего тяжёлого выполнять. Он фиксирует просмотр страницы одним запросом keepalive и в остальном простаивает:
fetch('/collect', {
method: 'POST',
keepalive: true,
body: JSON.stringify({ site_id, path: location.pathname })
})
keepalive: true позволяет запросу пережить страницу, не удерживая главный поток, поэтому навигация и unload никогда не блокируются в ожидании маяка.
Когда вы выполняете собственные скрипты, уступайте главный поток между блоками работы, чтобы накопленные взаимодействия могли выполниться:
async function processQueue(items) {
for (const item of items) {
handle(item)
if (navigator.scheduling?.isInputPending?.()) {
await scheduler.yield()
}
}
}
scheduler.yield() разбивает длинную задачу на части и возобновляет работу с приоритетом, так что сторонний скрипт не сможет влезть в очередь перед вашим продолжением.
Измеряйте на Реальных Устройствах, а Не в Лаборатории
Lighthouse не может сообщить INP, потому что INP существует только тогда, когда взаимодействует реальный человек. Лабораторные инструменты оценивают; они не измеряют отзывчивость.
Используйте данные с реальных устройств. Chrome User Experience Report (CrUX) агрегирует реальные взаимодействия согласившихся пользователей Chrome, а отчёт Core Web Vitals в Search Console показывает те же данные по группам URL. Если ваш INP в CrUX в порядке, но лабораторный Total Blocking Time высок, у вас есть запас; если INP в CrUX плохой, ваши пользователи уже это чувствуют.
Аргумент о приватности и аргумент о производительности здесь сходятся. Трекер, который не читает хранилище, не строит отпечаток и не тащит каскад вендоров, почти ничего не делает в главном потоке — и именно поэтому он никогда не проявляется в вашем INP. Слежка дорого стоит в миллисекундах, а не только в доверии.
Comments
Loading comments…