Core Web Vitals: пороги и что измерять

Google CWV — три метрики UX загрузки/стабильности. Ниже пороги «хорошо» (p75, полевые данные) и что обычно ломает оценку.

LCP (Largest Contentful Paint)

• Хорошо: ≤ 2,5 с; нужно улучшить: 2,5–4 с; плохо: > 4 с.
• Частая причина: тяжёлый hero-баннер, медленный TTFB, блокирующий JS до отрисовки.
• Действия: WebP/AVIF, responsive images, preload критичного шрифта, кэш CDN, серверная отдача HTML быстрее 200 мс до региона ЦА.

INP (Interaction to Next Paint)

• Хорошо: ≤ 200 мс; нужно улучшить: 200–500 мс; плохо: > 500 мс.
• Заменил FID: смотрит не первый клик, а отзывчивость UI в целом.
• Частые причины: длинные задачи в main thread, тяжёлые бандлы React без code splitting, синхронные обработчики на input.

CLS (Cumulative Layout Shift)

• Хорошо: ≤ 0,1; нужно улучшить: 0,1–0,25; плохо: > 0,25.
• Частые причины: баннеры/виджеты без резерва высоты, веб-шрифты без font-display: swap + fallback метрик, lazy-load без плейсхолдера.

Где смотреть

• Chrome DevTools → Lighthouse (лаборатория, не поле).
• Search Console → отчёт «Core Web Vitals» (поле по реальным пользователям Chrome).
• PageSpeed Insights — агрегирует lab + частично поле.

Что прописать в ТЗ

• Целевые p75: LCP / INP / CLS + инструмент приёмки (URL отчёта Lighthouse CI или порог в PSI).
• Ограничение на сторонние скрипты (реклама, чаты) — они чаще всего убивают INP.