Серверный рендеринг
Teaches server-side rendering (SSR) for React applications. Use when you need faster initial page loads, better SEO, or dynamic per-request HTML generation.
AIpatternsdev
official
Разработка
Что делает навык
Server-side rendering (SSR) — метод рендеринга веб-контента, при котором полный HTML-код страницы генерируется на сервере в ответ на запрос пользователя. Это позволяет избежать дополнительных запросов для получения данных и формирования шаблонов, а также не отправлять клиенту JavaScript, необходимый для рендеринга.
Когда применять
- Когда критически важны SEO и быстрая отрисовка первого контента (First Contentful Paint).
- Для страниц с большим объемом контента, которые должны быстро становиться видимыми для пользователей.
- Для страниц, которые должны быстро индексироваться поисковыми системами.
Как работает
- Обработка операций подключения и получения данных (fetch) выполняется на сервере.
- Генерация HTML, необходимого для форматирования контента, происходит на сервере.
- Клиенту отправляется готовый HTML, что исключает необходимость выполнения кода рендеринга на стороне клиента.
- JavaScript, соответствующий логике рендеринга, не отправляется клиенту.
Примеры запросов агенту
Как реализовать server-side rendering для React-приложения, чтобы улучшить SEO?
Объясни, как SSR помогает ускорить First Contentful Paint.
В чем разница между SSR и клиентским рендерингом с точки зрения отправки JavaScript?
Описание составлено по SKILL.md навыка, сверено 06.10.2026.
Как подключить
1Скачать навык
# возьмите папку навыка «server-side-rendering» из репозитория:
# https://github.com/patternsdev/skills
2Положить папку с
SKILL.md к навыкам ассистента# положите папку навыка туда, где ассистент ищет skills:
cp -r server-side-rendering/ ~/.claude/skills/server-side-rendering/
Навык — папка с файлом SKILL.md (описание + инструкции) и опциональными скриптами. Ассистент (Claude, Claude Code и совместимые) подхватывает его по описанию и следует шагам.