MPA、SPA、CSR、SSR、SSG、ISR

MPA（Multi-Page Application）：多頁式應用具有多個頁面應用程式，使用者訪問其他頁面時，需要重新加載頁面，大多狀態會保存在session或local storage。
較常見應用或框架：Stack Overflow、Laravel Blade、WordPress等等。

SPA（Single-Page Application）：單頁式應用包含在一個頁面的應用程式，使用者訪問其他頁面時，不需要重新加載頁面。
較常見應用或框架：Gmail、Facebook、Github、Vue.js等等

	MPA	SPA
優點	更好的SEO 擴充性佳	更快響應 更好的缓存功能 好的用戶體驗 方便Debug 維護性較好
缺點	速度和整體性能較差 開發時間較長 維護性較差	很差的SEO 缺少瀏覽紀錄 安全性問題
適用情境	在線商城 商業網站	移動式應用 Saas平台 社交應用

CSR（Client Side Rendering）：將渲染過程交給瀏覽器，當用戶訪問網站時，跟伺服器請求html檔案，再透過bundle（JavaScript）執行Ajax及請求資料，最後將渲染好的畫面呈現給用戶看到。
SSR（Server Side Rendering）：使用服務器端呈現 (SSR)，當用戶訪問網頁時，瀏覽器會向服務器發送對該頁面的請求；服務器從數據庫中獲取必要的數據，並將其與頁面內容渲染好一起發送到瀏覽器。 然後瀏覽器將其顯示給用戶。
SSG（Static Side Generation）：都在build時一起輸出到檔案，使用者在瀏覽時，可以直接取得到已經渲染好內容的HTML。
ISR（Incremental Static Regeneration）：ISR基本上是SSG的進化版，不過差別在於ISR會定期重建以及重新驗證最新頁面，避免內容不會過時。

	CSR	SSR	SSG	ISR
優點	第一次加載後，加載其他頁面很快 渲染時間快 服務器負擔小 動態	SEO佳 動態 頁面載入速度快	不需要過度仰賴數據庫或服務器 SEO佳 頁面加載速度快 安全性高	擁有SSG的優點 修改內容不需要重新建置
缺點	不適合SEO 初始加載和交互時間變慢，會導致性能差	服務器需求高，因為每個請求都仰賴伺服器 安全性差 緩存設定複雜	維護或更新較為困難 建置時需要花的時間較多	使用者有可能會看到舊的內容 建置時需要花的時間較多
適用情境	不需要SEO的網站	股票行情網站	產品展示網站	個人網站 部落格

參考資料：

https://dev.to/pahanperera/visual-explanation-and-comparison-of-csr-ssr-ssg-and-isr-34ea

https://ithelp.ithome.com.tw/articles/10266781

https://tapajyoti-bose.medium.com/frontend-rendering-ssg-vs-isg-vs-ssr-vs-csr-when-to-use-which-1bf9f39ff07c