筆記: 練習作文：SSR 原理，以 Next.js 為例

最近面試蠻容易遇到，大家都用框架也沒可能自己費工刻一個，因此練好作文說得一口好 SSR(Server Side Rendering) 還是需要練習一下。

一開始用 HTML 寫網頁的模式就是 CSR(Client Side Rendering)，在 Client 端開始解析 JS，建立 DOM，隨著頁面漸漸著重於 JS，以及前端框架興起的 SPA (Single Page Application)，提供了利用 Router 迅速切換頁面的優良體驗，但是這樣的模式帶來了幾個缺點，第一個是整包的 JS 載入十分花費效能，第二是一整包的 JS 爬蟲無法解析出 HTML 內容，不利 SEO，因此 React 發展出 Next ， Vue 發展出 Nuxt ，SSR 架構 Server Side 會回傳整個 HTML，並且在各個頁面重新呼叫 Request，避免初次載入整包 JS 造成效能問題，在一個產品的越後期要改成成 SSR 架構就越艱難，因此最好是早期就訂好 SEO 需求，決定架構是否採用 SSR 。