Типы рендеринга кода

Рендеринг - процесс создания окончательного HTML кода, который будет обработан браузером.

Существует два основных типа рендеринга:

• серверный, сокращенно SSR (server side rendering)
• клиентский, сокращенно CSR (client side rendering)

В случае серверного рендеринга HTML код создается на сервере и затем отправляется в браузер. В случае клиентского рендеринга HTML код динамически генерируется в браузере через JavaScript.

Оба способа имеют свои плюсы и минусы.

Особенности SSR:

• HTML код создается на сервере для каждого запроса. Это повышает нагрузку на сервер.
• Пользователь сразу получает готовую страницу, что делает страницу доступной до того, как JavaScript будет загружен и выполнен.
• SEO-дружелюбность: поисковые системы cмогут правильно обработать сайт.

Особенности CSR:

• Производительность: если браузер занят работой, например, обрабатывает данные, это замедляет другие процессы, например, построение DOM дерева. В этом время пользователи могут увидеть пустой экран.
• Безопасность: данные, которые хранятся на стороне клиента, легко могут быть обнаружены при просмотре страницы в отладчике браузера. Поэтому нельзя работать с важной информацией, например, с паролями или личными данными зарегистрированных пользователей на стороне клиента.
• Снижается нагрузка на сервер: серверу не нужно создавать HTML код для каждого нового запроса.
• Снижается нагрузка на интернет канал: в случае клиентского рендеринга от сервера в браузер нужно передать меньший объем текста.