Web Vitals ломают не SEO, а ощущение скорости: где чаще всего проваливают nextjs-проекты

Web Vitals ломают не SEO, а ощущение скорости: где чаще всего проваливают nextjs-проекты

LCP, INP и CLS — это не три абстрактные метрики, а три типовые поломки в real-world SSR и ISR:
— LCP обычно уезжает из-за тяжёлого hero-блока, позднего hero-image или блокирующего шрифта.
— INP портят лишний JS на клиенте, тяжёлые обработчики и лишние перерендеры.
— CLS появляется, когда у картинок, баннеров и блоков нет зарезервированного места.

В nextjs чаще всего ошибаются так:
— Рисуют всё через client component, хотя часть экрана можно отдать через ssr.
— Подключают видео, слайдеры и виджеты до того, как отрисовался основной контент.
— Забывают, что edge_compute и кеш не спасут, если сам первый экран тяжёлый.

Для проверки смотрите не только среднее значение, а конкретный путь до интерактива: какой запрос ждёт html, какой скрипт блокирует ввод, какой элемент скачет при загрузке. Если метрика плохая, ищите не «оптимизацию», а виновный слой: изображение, шрифт, hydration, сторонний код или layout shift из-за поздних данных.

Хороший web vitals-бюджет — это когда первый экран стабилен, интерактив не спорит с рендером, а isr обновляет контент без визуальных сюрпризов. Тогда vercel и nextjs работают как система, а не как набор случайных костылей.