Hydration & interactivity
The page is visible, but lifeless, until JavaScript wakes it up.
HTML arrives, inert
visible · clickable-looking · does nothing
JS attaches handlers
interactive ✓
For a server-rendered React page, the user sees fully styled HTML before any JavaScript has run. That HTML is inert: clicking a button does nothing, dropdowns don't open. The page is a poster.
Hydration is the handover. React (or any framework with the same model) walks the DOM the server already produced, lines it up against the component tree it would have rendered itself, and wires the event handlers into place. Once that pass finishes, the buttons respond, and the page is finally an actual application.
Takeaway
Hydration is the bridge between rendered HTML and a working application. The smaller the bundle, the sooner the bridge closes.