Server-side rendering (SSR) generates an application's HTML on the server before sending it to the browser. A backend handles requests, selects the components for the requested route, loads their data, and produces the initial markup. section 1.3.1 section 1.3.3
A typical SSR request follows these responsibilities:
- Receive the browser's request for an application URL. section 1.3.3
- Use the application router to determine which components match the requested route. section 1.3.3
- Instantiate those components, load data from other servers or databases, and run their mounting code. section 1.3.3
- Render the components as complete HTML and send the result to the browser. section 1.3.3
The returned page looks like static HTML, but the server creates it for each request. It initially lacks application event handlers, so hydration matches the HTML with virtual DOM nodes and attaches the handlers needed for interaction and dynamic updates. Navigating to another route requests a new HTML page from the server rather than updating the markup programmatically. section 1.3.3
Figure 1.15 The complete flow of an SSR application—rendered in the server and hydrated in the browser
Use the complete-flow diagram to connect server rendering, browser hydration, and subsequent interaction. section 1.3.3
