Glossary

Hydration

Hydration is the step where a page that arrived as ready-made HTML has its interactivity attached: the JavaScript loads, matches itself to the existing markup, and takes over the buttons, forms and menus.

It is what makes server-side rendering and static generation compatible with an interactive application — the visitor reads immediately, and the page becomes clickable a moment later.

That gap is the catch, and it produces a specific bad experience: content that is visible but not yet responding, so early clicks are lost. Keeping the amount of JavaScript small is the direct fix, which is why techniques that hydrate only the interactive parts of a page have become popular.

← Back to the glossary