Client-Side Rendering (CSR)

Rendering web pages directly in the browser using JavaScript, instead of relying on server-side rendering.

Client-Side Rendering (CSR) is a web rendering approach where the browser downloads a minimal HTML page and then uses JavaScript to fetch data and render the full page content on the client. Frameworks like React, Vue.js, and Angular commonly use this pattern through single-page application (SPA) architectures.

In a CSR application, the initial page load may be slower because the browser must download, parse, and execute JavaScript before content appears. Subsequent navigations, however, are typically faster because only data (usually fetched via API calls) needs to be retrieved rather than full HTML pages.

CSR applications rely heavily on APIs to fetch and submit data. This makes API design, performance, and reliability critical. An API gateway can improve CSR application performance by caching frequently requested API responses, compressing payloads, and enforcing rate limits to protect backend services from excessive client-side requests.