Skip to main content

Що таке Angular Universal? Як Angular Universal пов'язаний з SSR?

AngularJunior~1 хв читання
Запропонувати правку

Angular Universal - це офіційна технологія Angular, яка дозволяє виконувати Server-Side Rendering (SSR) для Angular-застосунків.

Що робить Angular Universal:

  • Запускає Angular-застосунок на сервері (Node.js)
  • Генерує готовий HTML для кожної сторінки
  • Віддає цей HTML браузеру
  • А потім Angular на клієнті "оживляє" сторінку (hydration)

Як Angular Universal пов'язаний з SSR:

SSRAngular Universal
Ідея: рендерити HTML на серверіІнструмент, який реалізує SSR в Angular
КонцепціяКонкретна реалізація
Абстрактний підхідГотовий робочий механізм для Angular

Тобто SSR - це "що ми хочемо", а Angular Universal - "чим ми це робимо".

Навіщо це потрібно:

  1. Швидке перше завантаження (First Paint) - контент видно до завантаження JS
  2. SEO - боти отримують повноцінний HTML
  3. Гарні прев'ю в соцмережах (OG-теги)
  4. Краще на слабких пристроях - менше JS-навантаження на старті

Як це виглядає в роботі:

  1. Користувач відкриває сторінку
  2. Node.js з Angular Universal рендерить HTML на сервері
  3. Браузер показує готову сторінку
  4. Angular на клієнті підключається і стає інтерактивним

Підсумок:

Angular Universal - це офіційний інструмент SSR для Angular. Він робить Angular-застосунки швидшими, помітнішими для пошукових систем і зручнішими для користувача.

Коротка відповідь

Для співбесіди
Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.

Запропонувати правку