Три подхода к рендерингу
Прежде чем выбирать технологию, полезно понять три основных подхода к тому, как страница попадает к пользователю.
CSR (Client-Side Rendering) — браузер получает пустой HTML и JavaScript, а сборка страницы происходит на устройстве пользователя. Это стандарт для SPA (React, Vue без SSR). Минус: медленный первый рендер, SEO-проблемы для поисковых роботов.
SSR (Server-Side Rendering) — HTML генерируется на сервере при каждом запросе и отправляется пользователю уже готовым. Браузер сразу показывает контент, поисковики индексируют полноценный HTML.
SSG (Static Site Generation) — HTML генерируется один раз при сборке и раздаётся как статика. Максимальная скорость, минимальная нагрузка на сервер. Подходит для контента, который меняется редко.
Когда SSR критичен
- SEO. Если сайт должен хорошо индексироваться поисковиками, SSR или SSG обязательны. Для Яндекса и Google CSR-приложения индексируются хуже — особенно когда контент динамический.
- Скорость первого рендера (FCP). Пользователь видит контент сразу, а не ждёт, пока JavaScript загрузится и соберёт страницу. Критично для мобильных с нестабильным соединением.
- Персонализированный контент + SEO. Интернет-магазины, новостные сайты, маркетплейсы — контент уникален для каждого запроса и должен индексироваться.
Популярные инструменты для SSR
Next.js — де-факто стандарт SSR для React. Гибкий: можно миксовать SSR, SSG и CSR на уровне отдельных страниц. Отличная экосистема, активное развитие.
Nuxt.js — аналог Next.js для Vue. Те же принципы, тот же уровень зрелости.
Remix — фокус на веб-стандартах и оптимизации загрузки данных. Набирает популярность как альтернатива Next.js.
Когда SSR — лишняя сложность
Для внутренних инструментов за авторизацией (дашборды, CRM-интерфейсы, личные кабинеты) SEO не нужен, а значит SSR не приносит ощутимой пользы. Здесь CSR с SPA — простое и правильное решение. Добавлять SSR «потому что современно» — это усложнение без реальной выгоды.
Вывод
SSR и SSG нужны там, где критично SEO и скорость первого рендера: публичные сайты, лендинги, блоги, e-commerce. Для приложений за авторизацией CSR остаётся оптимальным и более простым решением.