問題描述

我現在就只是前端用用框架寫一寫SPA，然后后臺只是處理下數據庫相關的數據，前后就restful形式的API傳遞下數據，至于這些個渲染毫無概念。所謂的服務端渲染就是指在后臺生成html文件傳給前端，那對于react和Vue這種引入了虛擬DOM的呢？前端渲染是指什么，解析html生成DOM樹然后繪制頁面？前端渲染和客戶端渲染是指同一個意思吧？前端渲染和服務端渲染應用場景都有哪些？

問題解答

一言兩句難以詮釋清楚, 可以參考下面的鏈接:前端渲染和后端渲染后端渲染html、前端模板渲染html，jquery的html，各有什么區別？精讀前后端渲染之爭

首先渲染，在這兒應該是只將數據和模版組裝成html。

前后端分離加上SPA的情況下，后端除了關鍵路徑帶認證那種的請求給你重定向之外，一般的路由邏輯都是前后端共享的，部分處理邏輯也是前后端共享，并且后端提供數據接口，與接口相關的數據處理邏輯就是后端獨有。

在SPA場景下服務端渲染都是針對第一次get請求，用于生產完整的html給瀏覽器，瀏覽器直接出首屏。客戶端渲染都是針對客戶端狀態變化，請求了數據，進行局部dom變化（局部可能大到整個body）。react/vue在這種場景下，服務端僅僅將jsx/模版轉換成html，客戶端根據props/state變化，協調虛擬dom和真實dom之間的同步。

在傳統前后端分離場景下，后端負責渲染完整html，前端js負責交互之后，改變幾個文字動畫之類的。沒有前端渲染。

綜述：

虛擬dom僅僅存在于前端，用于協調虛擬dom和真實dom差異，最小化更新真實dom。

前端渲染指 解析數據和模版，生成dom。跟后端一致。

是的，同一個意思，在web場景下。

前端渲染：不想每次小變化都請求服務端重新生成整個dom的場景。服務端渲染：絕大多數場景，極端場景是客戶端禁用js的時候。僅僅用前端渲染的場景估計是公司架構不允許react/vue做渲染（尚未部署node服務器）。通常情況，前后端渲染都有。

IT界有一個不好的習慣就是會造一個花里胡哨的名詞讓你不知道具體細節：

后端渲染：后端的程序在把html頁面吐給前端之前，先把html頁面上的特定區域，特定符號，給用數據填充過，再扔給前端，這就是后端渲染，所謂渲染，你可以理解一種修改，渲染這詞最早來源于游戲領域，游戲領域又來源于現實畫畫，渲染嘛，拿著顏料往紙上涂便是。以前絕大部分服務器都是這個模式

前端渲染：后端的html頁面作為靜態文件存在，前端請求時后端不對該文件做任何內容上的修改，直接以資源的方式返回給前端，前端拿到頁面后，根據寫在html頁面上的js代碼，對該html的內容進行修改（涂顏料）。這就是前段渲染