Skip to content
Glossary

What is hydration?

Hydration is the step where a page that arrived as server-rendered HTML gets its JavaScript attached in the browser, turning static markup into an interactive page.

It sits between two extremes: pure client-side rendering, where the browser builds the page from nothing, and plain static HTML, where nothing needs attaching at all. A hydrated page shows real content immediately because the server sent complete HTML, then becomes clickable a moment later once the JavaScript takes over the DOM the server already built.

The failure mode worth knowing is a hydration mismatch, where what the server rendered and what the client expects disagree. Frameworks often recover by discarding the server HTML and rebuilding it client-side. For a moment, and in rarer cases indefinitely if the mismatch never resolves, the content on the page reverts to whatever client-side rendering produces, which for a crawler that doesn't execute JavaScript can mean content it already had disappears.

Related

Want to know where you actually stand on this? Run a free visibility check or try the free tools.