Что такое SSG простыми словами?

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

Чем SSR отличается от SSG?

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

Чем плох CSR для коммерческого сайта?

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

Нужно ли выбирать что-то одно?

Нет, современные проекты комбинируют: статьи и страницы услуг — заранее собранными, каталог с фильтрами — с обновлением по расписанию, личный кабинет — в браузере. Смешанный подход и есть норма.

SSR, SSG и CSR: как страница попадает к посетителю

Три аббревиатуры, которые заказчик обычно пропускает мимо ушей, а они определяют скорость сайта и то, увидит ли поисковый робот ваше содержимое.

Разбираем на аналогии, без кода.

Аналогия с кухней

SSG — заранее приготовленное. Блюда сделаны до прихода гостей и стоят готовыми. Гость получает еду мгновенно.

SSR — готовим на заказ. Гость пришёл, повар начинает готовить. Дольше, зато блюдо свежее и можно учесть пожелания.

CSR — гость готовит сам. Ему выдают продукты и рецепт, он собирает блюдо у себя. Ресторан не тратит ресурсы, но гость ждёт и должен уметь готовить.

Дальше — что это означает практически.

SSG: страницы собраны заранее

Страницы генерируются при публикации сайта и лежат готовыми файлами.

Плюсы: максимальная скорость первого показа, робот сразу видит содержимое, легко выдерживает всплески посещаемости, дешёвый хостинг.

Минусы: содержимое обновляется при пересборке, не подходит для данных, зависящих от пользователя.

Для чего: страницы услуг, статьи, описания, лендинги, гео-страницы, портфолио — всё, что меняется нечасто.

Именно этот подход даёт заметное преимущество коммерческим сайтам, о чём в статье что такое Next.js.

SSR: сборка на сервере при запросе

Посетитель запрашивает страницу, сервер собирает её и отдаёт готовой.

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

Минусы: медленнее отдаёт первый байт, выше нагрузка на сервер, дороже хостинг при большом трафике.

Для чего: страницы с постоянно меняющимися данными — остатки и цены в живом каталоге, персонализированные разделы.

CSR: сборка в браузере

Сервер отдаёт пустую заготовку, скрипты подгружают данные и строят страницу.

Плюсы: отзывчивость после загрузки, меньше нагрузки на сервер, удобно для сложных интерфейсов.

Минусы: посетитель сначала видит пустоту, робот может не дождаться содержимого, плохие метрики первого показа.

Для чего: личные кабинеты, панели администратора, внутренние сервисы — то, что закрыто от поиска и где важна работа после загрузки.

Для чего не подходит: публичные страницы, которые должны находиться в поиске. Это одна из причин, по которым сайт может не появляться в выдаче — разбор в статье почему сайт не появляется в поиске.

Смешанный подход — норма

Современные проекты не выбирают что-то одно, а комбинируют по типу страницы:

Тип страницы	Подход
Услуги, статьи, лендинги	Собраны заранее
Каталог с меняющимися ценами	Заранее, с обновлением по расписанию
Страница с персональными данными	Сборка на сервере
Личный кабинет	В браузере

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

Как это влияет на бизнес

Скорость первого показа. Заранее собранная страница открывается быстрее всего. Что это значит для метрик — в статье Core Web Vitals.

Индексация. Если содержимое появляется только после выполнения скриптов, есть риск, что робот его не увидит.

Стоимость хостинга. Статика дешевле в обслуживании и лучше держит нагрузку — что учитывать при выборе площадки, в статье как выбрать хостинг.

Устойчивость. Заранее собранные страницы продолжают отдаваться, даже если база данных недоступна.

Что спросить у подрядчика

Три вопроса, которые снимают неопределённость:

«Робот увидит содержимое сразу или после выполнения скриптов?» Ответ должен быть «сразу» для всех публичных страниц.

«Какие страницы собираются заранее, а какие на лету?» Внятный ответ показывает, что архитектура продумана.

«Как часто обновляются заранее собранные страницы?» Важно для каталогов с меняющимися ценами.

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

Итог

Три подхода: собрано заранее (быстро, для нечасто меняющегося), собирается на сервере (актуально, для меняющегося), собирается в браузере (для закрытых интерфейсов).

Для коммерческого сайта основная масса страниц должна быть собрана заранее — это даёт лучшую скорость и снимает вопросы с индексацией.

Полностью в браузере публичные страницы отрисовывать не стоит: это самая частая техническая причина, по которой хороший сайт плохо виден в поиске.