前端三十｜18. [FE] 為什麼網站要做成 SPA？SSR 的優點是什麼？
稍有經驗的開發者，可能對最近 SPA，SSR 等術語不太陌生，大概也能知道 SPA 指的是單頁式應用（Single Page Application）、SSR 是伺服器渲染（Server-Side Rendering）；可是仔細想想，在前端整個興起之前，主流的 PHP、JSP 不也是伺服器渲染嗎？中間發生了什麼？現在的開發者又為什麼開始想走回 SSR 了呢？
今天就讓我們一起來了解在那些專有名詞的背後，有著什麼時空背景及技術限制吧。
本系列文已經重新編校彙整編輯成冊，並正式出版囉！
《前端三十：從 HTML 到瀏覽器渲染的前端開發者必備心法》好評販售中！
喜歡我文章內容的讀者們，歡迎您前往購買支持！
從頭說起
筆者我剛進入相關領域時寫的是 JSP（Java Server Pages），基本語法跟原生的 ASP、PHP 有點像，藉由 <% & %> 標出 Java 程式的範圍，後端進行編譯、運算後，再將處理好的 .jsp 檔回給前端；而與使用者的的互動則透過 jQuery 控制。因此那時所撰寫的程式經常會在同一隻 .jsp 檔，內容混合著 Java 及 JavaScript 的程式，再加上透過 jQuery 動態操縱 DOM 及 CSS，可以說是真正的 義大利麵程式碼。
MVC
於是一些開發者就開始嘗試，將資料與 UI 分離，再撰寫控制器去操縱、計算這兩者，也就是俗稱的 MVC 架構。MVC 為三個字的縮寫，分別代表：
- Model：模型，負責處理資料、演算法、商業邏輯等等。
- View：視圖：欲呈現的畫面。
- Controller：控制器，控制、處理使用者的請求（request）。
藉由這樣權責分明的設計，糾纏混亂的義大利麵變成了各自獨立的 義大利餃，程式的整體架構也得以被這樣的設計梳理整齊。
MVC 帶來了更低的耦合度，更高的可維護性，並且讓專案能被完整的分工，這樣的概念得到開發者的喜愛，最著名的大概是幾年前熱門的 RoR 吧？當然其他各大語言也都有包含此概念的框架被實作出來，開發者可以輕易的挑選到合適自己的 MVC 框架，並快速架構出網站伺服器的雛形。透過 MVC 架構，也算是讓 SSR…
