什么是服務端渲染（SSR）？

　　假設有項目需要渲染一個首頁，平時我們的項目啟動后，開始渲染，請求頁面，返回的body為空，然后執行js將html結構注入body中，再結合css來渲染樣式，展現出來。

　　而使用了服務端渲染（SSR）后，簡單理解是將組件或頁面通過服務器生成html字符串，再發送到瀏覽器，最后將靜態標記"混合"為客戶端上完全交互的應用程序。渲染時請求頁面，返回的body里已經存在服務器生成的html結構，之后只需要結合css顯示出來。這就節省了訪問時間和優化了資源的請求。

使用SSR后的優點？

　　1. 更利于網站的SEO

　　2.更利于首屏頁面的渲染

使用SSR后的局限性？

　　1. 服務端壓力較大

　　本來是通過客戶端完成渲染，現在統一到服務端node服務去做。尤其是高并發訪問的情況，會大量占用服務端CPU資源。

　　2. 開發條件受限

　　在服務端渲染中，只會執行到componentDidMount之前的生命周期鉤子，因此項目引用的第三方的庫也不可用其它生命周期鉤子，這對引用庫的選擇產生了很大的限制。

　　3. 學習成本相對較高

　　除了對本身項目使用的前端框架要熟悉，還需要掌握webpack、node、Koa2等相關技術。相對于客戶端渲染，項目構建、部署過程更加復雜。

部分理解和思路：

　　next.js / nuxt.js 可以很好的完成SSR。

　　對于toB的項目，SSR無所謂，對于toC的項目，SSR還是必要的。

　　用了前端框架，瀏覽器接收到的還是模板和大量的JS，數據需要異步請求過來。所以存在SEO和性能問題。這時候就需要SSR了。

　　如果不使用服務器端渲染，一個頁面的展示流程大概就是，瀏覽器先下載html和js，然后到服務器請求json數據，最后根據json生成頁面。

　　如果使用服務器端渲染的話，以上步驟都在服務器端執行，也就是說服務器端從自己服務器那里先獲取json，然后生成頁面，最后把生成的頁面輸出成html給瀏覽器下載。

總結

以上是生活随笔為你收集整理的前端对于服务端渲染（SSR）的理解的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。