SPA, SSR, SSG: выбор подхода

↑ 8.2 Архитектура фронтенда и паттерны · ← Предыдущая · → Следующая

Желательно~3 мин чтенияУровень: senior

Зачем это на собесе

Итоговое решение архитектора: на каких критериях выбирать.

Критерии

Критерий	SPA (CSR)	SSR	SSG
SEO	слабое	отличное	отличное
Первый показ	медленнее	быстрее	самый быстрый
Интерактивность	сразу после загрузки JS	после гидрации	после гидрации
Персонализация	легко	средне	клиентскими блоками
Стоимость инфраструктуры	статика	сервер	статика/CDN
Свежесть данных	по запросу	по запросу	при сборке/ISR
Сложность разработки	низкая	выше	средняя

Дерево решений

1. Нужен SEO и первый показ важен? Нет → SPA (админки, дашборды, внутренние сервисы).
2. Контент редко меняется, страниц не миллионы? → SSG.
3. Контент меняется часто, но публичный? → SSR с кэшем или ISR.
4. Смесь? → гибрид по маршрутам (Nuxt routeRules).

Примеры

• CRM, панель заказов → SPA;
• документация, блог → SSG;
• интернет-магазин → SSR/ISR, корзина и профиль клиентским кодом;
• лендинг с формой → SSG.

Дополнительно

• Pre-rendering для отдельных SPA-страниц;
• островная архитектура (Astro) для контентных сайтов;
• при SSR продумать кэш, нагрузку, деградацию.

Вопросы с ответами

Почему для админки выбирают SPA?

SEO не нужно, страницы за авторизацией, данные персональные, деплой статики дешевле и проще.

Как получить SEO при SPA-кодовой базе?

Пререндер ключевых страниц, SSR через Nuxt/Quasar SSR, динамический рендеринг для ботов как временная мера.