客戶端渲染和服務端渲染的區別

服務端渲染：DOM樹在服務端生成，而後返回給前端。

客戶端渲染（SSR）：前端去後端取數據生成DOM樹。

 

服務端渲染的優勢：

　　一、儘可能不佔用前端的資源，前端這塊耗時少，速度快。

　　二、有利於SEO優化，由於在後端有完整的html頁面，因此爬蟲更容易爬取信息。

服務端渲染的缺點：

　　一、不利於先後端分離，開發的效率下降了。

　　二、對html的解析，對前端來講加快了速度，可是加大了服務器的壓力。

客戶端渲染的優勢：

　　一、先後端分離，開發效率高。

　　二、用戶體驗更好，咱們將網站作成SPA（單頁面應用）或者部份內容作成SPA，當用戶點擊時，不會造成頻繁的跳轉。

客戶端渲染的缺點：

　　一、前端響應速度慢，特別是首屏，這樣用戶是受不了的。

　　二、不利於SEO優化，由於爬蟲不認識SPA，因此它只是記錄了一個頁面。

 

服務端和客戶端渲染的區別：

　　一、兩者本質的區別：是誰來完成了html的完整拼接，服務端渲染是在服務端生成DOM樹，客戶端渲染是在客戶端生成DOM樹。

　　二、響應速度：服務端渲染會加快頁面的響應速度，客戶端渲染頁面的響應速度慢。

　　三、SEO優化：服務端渲染由於是多個頁面，更有利於爬蟲爬取信息，客戶端渲染不利於SEO優化。

　　四、開發效率：服務端渲染邏輯分離的很差，不利於先後端分離，開發效率低，客戶端渲染是採用先後端分離的方式開發，效率更高，也是大部分業務採起的渲染方式。

 

直觀的區分服務端渲染和客戶端渲染：

　　源碼裏若是能找到前端頁面中的內容文字，那就是在服務端構建的DOM，就是服務端渲染，反之是客戶端渲染。

 

應該使用服務端渲染仍是客戶端渲染：

　　咱們要根據業務場景去選擇渲染的方式。

　　若是是企業級網站，主要功能是頁面展現，它沒有複雜的交互，而且須要良好的SEO，那咱們應該使用服務端渲染。

　　若是是後臺管理頁面，交互性很強，它不須要考慮到SEO，那咱們應該使用客戶端渲染。

　　具體使用哪一種渲染方式也不是絕對的，如今不少網站使用服務端渲染和客戶端渲染結合的方式：首屏使用服務端渲染，其餘頁面使用客戶端渲染。這樣能夠保證首屏的加載速度，也完成了先後端分離。