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

1、首先先來了解三個專業名詞：

（1）spa：單頁面應用：只有一張web頁面的應用，是一種從web伺服器載入的富客戶端，單頁面跳轉僅重新整理區域性資源，公共資源僅需載入一次，常用於pc端**，購物等**。

優點：頁面之間切換快，減少了伺服器的壓力

（2）seo：搜尋引擎優化，利用搜尋引擎的規則提高**在有關搜尋引擎的自然排名

因為spa單頁面應用，是通過ajax獲取資料，這就難保證我們的頁面能被搜尋引擎收到，並且有一些搜尋引擎不支援js和通過ajax獲取資料。那就更不用提seo了，為了解決這個問題就產生了ssr。

（3）ssr服務端渲染：ssr的出現一定程度上解決了spa首屏慢的問題，又極大的減少了spa對於seo的不利影響。

更好的ssr，我們可以將seo關鍵資訊直接在後台渲染成html，從而保證了搜尋引擎可以提取到相應資料。

缺點：占用了大量的cpu和記憶體資源

2、接下來便是服務端渲染和客戶端渲染的定義與區別

服務端渲染：在早期的時候，由於頁面比較簡單，前後端分離還沒有做的比較完善，所以當時一般頁面渲染還是在服務端完成html檔案的拼裝，然後瀏覽器接收到這個檔案，就可以直接解析展示。

服務端渲染：如今前端頁面的複雜性提高，前端已經不再僅僅是普通的頁面展示了，現在前端頁面功能更加完善，也更加複雜。同時伴隨著ajax的興起，使得現在越來越崇尚前後端分離的開發方式。

後端不再提供完整的html頁面，而是提供一些api使得前端可以獲取需要的json資料，然後前端拿到資料後在前端完成html頁面的拼裝，然後展示在瀏覽器上，這就是客戶端渲染。

伺服器端渲染的優缺點是？

優點：前端耗時少。因為後端拼接完了html，瀏覽器只需要直接渲染出來。

有利於seo。因為在後端有完整的html頁面，所以爬蟲更容易爬取獲得資訊，更有利於seo。

無需占用客戶端資源。即解析模板的工作完全交由後端來做，客戶端只要解析標準的html頁面即可，這樣對於客戶端的資源占用更少，尤其是移動端，也可以更省電。

後端生成靜態化檔案。即生成快取片段，這樣就可以減少資料庫查詢浪費的時間了，且對於資料變化不大的頁面非常高效。

缺點：不利於前後端分離，開發效率低。使用伺服器端渲染，則無法進行分工合作，則對於前端複雜度高的專案，不利於專案高效開發。另外，如果是伺服器端渲染，則前端一般就是寫乙個靜態html檔案，然後後端再修改為模板，這樣是非常低效的，並且還常常需要前後端共同完成修改的動作；或者是前端直接完成html模板，然後交由後端。另外，如果後端改了模板，前端還需要根據改動的模板再調節css，這樣使得前後端聯調的時間增加。

占用伺服器端資源。即伺服器端完成html模板的解析，如果請求較多，會對伺服器造成一定的訪問壓力。而如果使用前端渲染，就是把這些解析的壓力分攤了前端，而這裡確實完全交給了乙個伺服器。

優點：前後端分離。前端專注於前端ui，後端專注於api開發，且前端有更多的選擇性，而不需要遵循後端特定的模板。

缺點：前端響應較慢。如果是客戶端渲染，前端還要進行拼接字串的過程，需要耗費額外的時間，不如伺服器端渲染速度快。

使用伺服器端渲染還是客戶端渲染？

還是要根據具體的實際情況進行選擇，比如企業級**，主要功能是展示而沒有複雜的互動，並且需要良好的seo，則這時我們就需要使用伺服器端渲染；而類似後台管理頁面，互動性比較強，不需要seo的考慮，那麼就可以使用客戶端渲染。

另外，具體使用何種渲染方法並不是絕對的，比如現在一些**採用了首屏伺服器端渲染，即對於使用者最開始開啟的那個頁面採用的是伺服器端渲染，這樣就保證了渲染速度，而其他的頁面採用客戶端渲染，這樣就完成了前後端分離。

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

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

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

服務端渲染和客戶端渲染的對比

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

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

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

服務端渲染和客戶端渲染的對比

相關推薦