客戶端渲染（CSR）
客戶端渲染 (CSR) 指的是在瀏覽器中使用 JavaScript 生成 HTML 內容的做法。CSR 與 伺服器端渲染 相對應，伺服器端渲染是由伺服器生成 HTML 內容。這兩種技術並非互斥，可以在同一個應用程式中一起使用。
純 CSR 應用可能會返回以下 HTML 內容：
html
<!doctype html>
<html lang="en-US">
<head>
<title>My App</title>
<script src="bundle.js"></script>
</head>
<body>
<div id="root"></div>
<noscript>
<p>This app requires JavaScript to run.</p>
</noscript>
</body>
</html>
然後，實際的頁面內容由 `bundle.js` 中的 JavaScript 生成，並使用 DOM 操作。
CSR 的優勢包括：
- 互動性：任何頁面更新，包括路由跳轉，都不需要完全重新載入頁面。這使得應用程式感覺更快、響應更靈敏。
- 效能：伺服器只需傳送初始 HTML 內容和 JavaScript 資源。後續的頁面更新可以從 API 獲取，這可能比獲取完整的 HTML 頁面更快，並且能減少伺服器的負載。
SSR 和 CSR 在效能上都有各自的權衡，可以結合使用 SSR 和 CSR 的優勢。例如，伺服器可以生成一個帶有空佔位符的頁面骨架，然後客戶端可以按需獲取額外資料並更新頁面。
請注意，單頁應用程式並不一定需要是 CSR。現代框架，如 React、Vue 和 Svelte，都可以用來構建支援 SSR 功能的 SPA。