Hydration (Гидратация) – процесс восстановления разметки, пришедшей с сервера на клиенте 👨🏻‍💻

В случае отсутствия гидратации при включенном SSR при получении новой разметки вся страница подвергается перерисовке

Это не самый оптимальный вариант, так как он ухудшает показатели и UX (страница теряет состояние, может возникнуть ситуация, в которой для обновления маленькой части страницы необходимо перерисовать её полностью)

При включении гидратации происходит оптимизация процесса перерисовки приложения за счёт навешивания слушателей на DOM-узлы. При получении разметки, перерисованы будут только те части, которые действительно изменились

Ограничения:
- DOM на клиенте и сервере должен быть одинаковым (если мы используем DOM API в коде, это может стать причиной ошибок гидратации)
- HTML должен быть валидным (иначе будут ошибки гидратации)

Гидратацию можно отключить для конкретного компонента (отключится и у дочерних)

Документация

#заметки #angular