Що таке pre-rendering?
Pre-rendering (попередній рендеринг) - це підхід, за якого HTML-сторінки генеруються заздалегідь, під час збірки проєкту, а не на сервері при кожному запиті (як у SSR).
Як це працює:
- Під час білда Angular (або іншого фреймворка)
- Створюються готові HTML-файли для обраних маршрутів
- Ці HTML-сторінки складаються в
dist/ - Сервер потім просто віддає статичний HTML, без Node.js і SSR-логіки
Чим pre-render відрізняється від SSR:
| SSR | Pre-render | |
|---|---|---|
| Генерація HTML | при кожному запиті | один раз - на етапі збірки |
| Сервер | потрібен Node.js | можна віддати через будь-який статичний хостинг |
| Підходить для | динамічних даних | статичних сторінок |
Коли pre-render ідеальний:
- Лендинги
- Блоги і документація
- Сторінки «Про нас», «Контакти», «FAQ»
- E-commerce категорії, які рідко змінюються
Тобто там, де контент не змінюється щохвилини.
Переваги:
- Миттєве завантаження (як звичайний статичний сайт)
- Відмінне SEO, бо HTML вже готовий
- Немає навантаження на сервер, SSR-рендеринг не виконується на льоту
- Працює на будь-якому хостингу (Firebase, GitHub Pages, AWS S3, Netlify...)
Мінуси:
- Не підходить для сильно динамічних сторінок
- При оновленні даних потрібен пересбір і повторний prerender
Підсумок:
Pre-rendering - це статична версія SSR. Сторінки генеруються заздалегідь, SEO працює відмінно, перший екран швидкий, а сервер не потрібен.
Коротка відповідь
Для співбесідиPremium
Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.