Оптимизация Nuxt SPA (Дмитрий Лаврик)

Aноним · 28 Авг 2025

Компактный курс, на котором мы рассмотрим улучшение производительности приложения и его SEO-показателей.

Основные направления работы: выделение критических CSS-стилей и кеширование SSR. Помимо этого, будет разобрана масса мелочей, улучшающих наше SPA.

Курс предназначен для тех, кто

Прошёл курс по Nuxt либо самостоятельно освоил работу с ним
Не понимает, как улучшить систему с точки зрения SEO
Хочет освоить фишки, помогающие SEO и скорости работы сайта

Основные темы курса

Базовые требования гугла

Core Web Vitals ( FCP, LCP, FID / INP )
Скорость ответа сервера и размер DOM
Критические и асинхронные стили
Минимизация размеров статики
Отсутствие прыжков контента

Обзор проблем текущей SPA

Тяжёлые критические стили
Потенциально тяжёлый JSON in HTML
Долгий ответ при SSR без кеша
Отсутствие оптимизации статических ресурсов
Отсутствие ряда SEO-тегов и т.п.

Работа с критическим CSS

Ручное / автоматическое разделение стилей
Эксперименты с npm critical
Персональные стили страниц
Генерация стилей после build
Nitro-плагин внедрения стилей

SSR и кеширование

Замеры скорости рендеринга
Выбор стратегии кеша: memory / redis
Поиск готовых решений
Создание своего плагина
Варианты инвалидации кеша

Backend for frontend

Нестыковки backend api и frontend
Примеры разрастания JSON
Примеры неудачных api-решений
Создание промежуточного backend
Идеи кеширования данных

Классическое SEO

Сайты для проверки мелочей SEO
Размер DOM при увеличении страниц SPA
Canonical, description, og-размтека и т.п.
Оптимизация изображений
Изображения и адаптивка