【30秒で理解】ハイドレーションとは？

ハイドレーションとは、以下の一連のプロセスのことを指す。

1. SSR（サーバーサイドレンダリング）によって生成されたHTMLに対し、CSR（クライアントサイドレンダリング）によってReactのようなUIライブラリやイベントハンドラを反映させる。
2. その結果生成された仮想DOMがSSRによるHTMLと整合性確認される。

ハイドレーションがあることで、ユーザーはまず静的なHTMLを初期表示で素早く視認でき、UXの待ち時間を短縮できる。その裏で動的なコンテンツが付与されるため、スムーズなユーザー体験を実現することが可能。