Назад на главную
EXCERFIA.CASE // 02WEB-DEVELOPMENT
[ КЕЙСОВЫЙ ОТЧЕТ #2 : МАКСИМАЛЬНАЯ СКОРОСТЬ ]

EXCERFIA-VELOCITY

Ультрабыстрый E-commerce портал с высокой интерактивностью на стэке Next.js & Tailwind

СКОРОСТЬ ПЕРВОЙ ОТРИСОВКИ (LCP)
3.4 сек

Мгновенный отклик даже на медленных мобильных 3G сетях.

ОПТИМИЗАЦИЯ СДВИГА МАКЕТА (CLS)
0.24

Идеальная сборка скелетов разметки исключает дёрганье контента.

СТЭК РЕШЕНИЯ И ВЕРСТКИ
Next.jsReactTailwindFramer Motion

ЧЕГО ПЫТАЛИСЬ ДОСТИЧЬ

Задачей было создать сложный интернет-магазин с богатыми анимациями товаров, корзины, фильтрации и при этом не просесть в внутренних метриках производительности.

  • Static Optimization Engine: Контент карточек товаров полностью рассчитывается во время сборки (SSG) и сохраняется на Edge-нодах.
  • Компиляция стилей Tailwind v4: Удалили неиспользуемые селекторы на этапе пре-процессинга, размер JS/CSS бандла сократился на 82%.
  • Framer Motion Dynamic: Все тяжелые анимации перенесены на аппаратное ускорение видеокарты (useWillChange) для плавной прокрутки со стабильными 120 FPS.

СТАТИСТИКА ПРОЕКТА ПОСЛЕ ПУБЛИКАЦИИ

CRITICAL PATH TIME
110 мс
CONVERSION INCREASE
+ 34.2%
LIGHTHOUSE STRESS SIMULATOR
OPTIMAL ENGINE

Попробуйте применить различные уровни инженерной оптимизации прямо в симуляторе веба и посмотрите, как это повлияет на скорость загрузки мобильной версии страницы.

score
68
LCP Speed
3.4s
cls drift
0.24