Hydration
Hydration is the client-side process of attaching application behavior, state, and interactivity to previously rendered user-interface markup.
Pro Angular 16
Rehydration is the process of attaching client-side application behavior to server-generated HTML after the JavaScript required to run that behavior has downloaded.
- How it is used
- Transitions SSR or prerendered HTML to browser-generated application content while JavaScript downloads and starts.
- How deep it goes
- Explains element reuse, module configuration, server-browser preparation, and browser testing; stops short of hydration internals.
- Examples
- Uses a prerendered store with disabled navigation and a throttled-browser reload that shows controls becoming active.
- What you can do after
- Apply it via Angular’s provideClientHydration, prepare server-generated controls, and verify the handoff with network throttling.
Build a Frontend Web Framework (From Scratch)
Hydration is the process of associating server-rendered HTML with corresponding client-side virtual DOM nodes and attaching event handlers so the page becomes interactive.
- How it is used
- Connects server-rendered markup to client-side behavior so an SSR page becomes interactive.
- How deep it goes
- Defines the matching and event-binding flow, then follows browser-side updates, without detailing framework-specific implementation code.
- Examples
- Uses server-generated HTML, component virtual DOM nodes, event handlers, and browser-side HTML patching.
- What you can do after
- Evaluate how an SSR page becomes responsive after JavaScript connects existing markup to component behavior.
Read how Build a Frontend Web Framework (From Scratch) explains hydration →
Related concepts
- handleruses · A handler is a callable or software component that processes an event, request, message, or other input and performs associated processing.
- virtual DOMuses · A virtual DOM is an in-memory user-interface tree that frameworks compare or process to determine updates to the rendered DOM.
- static HTML representationuses · A static HTML representation is an HTML rendering of an application that can be served without dynamically executing the application first.
- HTMLuses · HTML (HyperText Markup Language) is the standard markup language for structuring content and elements in web documents.
- HTML elementuses · An HTML element is a component of an HTML document, defined by markup and represented in the document structure, with permitted attributes, content, and semantics.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.