Серверный рендеринг (SSR)
Краткое определение
Серверный рендеринг означает, что HTML страницы формируется на сервере, а не в браузере, и отправляется посетителю уже готовым к показу.
Когда поступает запрос, сервер собирает нужные данные, тут же формирует полный HTML страницы и отправляет его браузеру; браузер сразу получает видимый контент вместо того, чтобы заполнять пустую оболочку. Такие фреймворки, как Next.js, управляют этим постранично.
С ним сталкиваются на часто меняющемся контенте, например при отображении остатков товара или страниц, персонализированных для вошедшего пользователя, где данные должны быть актуальными при каждом запросе.
Его часто путают со статической генерацией сайта (SSG). SSG собирает страницу один раз заранее и отдает ее как готовый файл, тогда как SSR пересобирает ее при каждом запросе, оставаясь более актуальным, но создавая большую нагрузку на сервер.
Самая частая ошибка: строить на SSR даже редко меняющиеся страницы, например страницу о компании, из-за чего возникает лишняя нагрузка на сервер и увеличивается время до первого байта. Правильный подход: использовать SSR только для страниц, которым действительно нужны свежие данные при каждом визите, а для остальных Вы выбираете статическую генерацию или рендеринг с кешированием.
Почему это важно
Поисковые системы и боты социальных сетей корректно читают и показывают превью страницы, когда она приходит уже заполненной контентом. SSR укрепляет и SEO, и первое впечатление, особенно на часто меняющихся страницах.
Условный пример
Страница остатков и цен производителя напольных покрытий пересобирается на сервере при каждом визите, поэтому поисковые системы всегда видят актуальные остатки.
