Почему мы отдаём SPA через сервер: честный разбор SSR

Одностраничные приложения удобны разработчикам, но поисковики и аналитика видят их хуже. Рассказываем, как мы в студии решаем эту проблему серверным рендерингом и что это даёт бизнесу.

React-приложение, где весь сайт рисуется в браузере пользователя, — стандарт современной разработки. Но у этой архитектуры есть скрытая цена: поисковый робот, вебмастер и часть аналитики видят не готовую страницу, а пустой корпус и JavaScript, который ещё предстоит выполнить.

В чём проблема классического SPA

• Поисковый робот может не дождаться рендеринга и уйти с пустой страницы — особенно на слабом бюджете обхода.
• Сервисы проверки (вебмастер, валидаторы разметки, предпросмотры в мессенджерах) получают HTML без контента.
• Первый экран загружается медленнее: сначала JS, потом запросы, потом рендер — а не готовый HTML сразу.

Как мы это решаем

Наш подход: сервер на каждый запрос отдаёт уже собранный HTML — с контентом, мета-тегами, верификацией поисковиков и разметкой. Браузер получает готовую страницу за один запрос, а JavaScript поверх делает её интерактивной. Это гибрид: скорость и индексируемость статики плюс удобство разработки SPA.

Практические следствия для проектов:

1. Верификация Яндекс.Вебмастера и Google видит мету в исходном коде — без танцев с файлами-подтверждениями.
2. Метрика и аналитика срабатывают сразу, в первом ответе сервера.
3. LCP улучшается за счёт мгновенного первого экрана.
4. Предпросмотр ссылки в Telegram и соцсетях показывает заголовок и описание корректно.

Архитектура должна служить бизнесу, а не удобству разработки. Красивый код, который поисковик не видит, — это код, который не приводит клиентов.

Когда SSR не нужен

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

Вывод

Технология — это инструмент достижения цели. Цель сайта студии — быть видимым и быстрым. Поэтому серверный рендеринг у нас не опция «за доплату», а стандарт по умолчанию для всех публичных страниц.

Что выбрать: SSR, SSG или гибрид

Три подхода решают одну задачу по-разному. SSR рендерит страницу на каждый запрос — подходит для динамики и персонализации. SSG собирает все страницы заранее в статику — максимальная скорость для контентных сайтов. Гибрид отдаёт статикой то, что меняется редко, и рендерит на сервере персональные части. В наших проектах дефолт — гибрид: каталоги и статьи статикой, корзина и кабинет через серверный рендеринг. Так мы получаем и скорость, и актуальность.

Критерий выбора простой: если страница одинакова для всех посетителей и меняется редко — её место в статике; если зависит от сессии или запроса — только серверный рендеринг. Всё остальное — вопрос бюджета и инфраструктуры, а не веры в технологию.