Server-Side Rendering (SSR) Impact
Evaluate the performance trade-offs of Server-Side Rendering (SSR) versus Client-Side Rendering (CSR) and their impact on TTI.
SSR vs. CSR: The Core Idea
Welcome to understanding how web pages get built! Today, we'll explore two fundamental ways web content reaches your browser: Client-Side Rendering (CSR) and Server-Side Rendering (SSR).
Both have unique impacts on performance, especially how quickly a user can see and interact with your page.
How Client-Side Rendering Works
With CSR, your browser receives a minimal HTML file, often just a blank page with a link to a JavaScript bundle. It's like an empty canvas.
- Browser downloads HTML: Very small, quickly.
- Browser downloads JavaScript: This is the main part, often large.
- JavaScript fetches data & builds UI: After loading, JS executes, calls APIs, and dynamically injects content into the page.
The user sees content only after these steps complete.
All lessons in this course
- Backend Performance Bottlenecks
- Database Query Optimization
- Server-Side Rendering (SSR) Impact
- API Response Caching and Compression