淺談前端瀏覽器渲染和服務端渲染

先給幾個定義:?

? ? ? ? ?渲染:指的是生成html文檔的過程,并非瀏覽器渲染html。

? ? ? ? ?模板引擎:模板解析(編譯)和數據渲染。這兩個步驟放在后端執行,則是像Smarty,FreeMarker這樣的后端模板引擎;如果放在前端執行,就是我們所說的前端模板,如juicer。

? ? ? ? ? ?服務端渲染:后端模板引擎

? ? ? ? ? ?瀏覽器渲染:前端模板引擎或用JS 渲染

? ? ? ? ? ?在傳統的web開發中,通常是前端將靜態頁面寫好后給后端人員,后端人員會將其轉成.VM、.JSP 文件,這些VM,JSP實際上就是后端的模板引擎。當客戶端發送頁面請求時,這些VM,JSP文件被服務端處理后返回的是帶有數據的html,它的編譯過程和數據的渲染都是在服務器完成的。而前端的模板引擎,如 juicer ,它是對請求后的數據進行渲染,也就是html的生成過程是在客戶端完成的。

? ? ? ? ? 題外話,根據上述的內容,終于明白為什么要前后端分離。假設有客戶提出在界面上添加個東西,按照傳統的做法,前端先做個模板,然后和后端對接,后端有問題找前端修改再對接。這種方式的前端做的是前端的工作,但不全,而后端做的不只是提供數據接口的工作,因為他們還要將html? 轉成VM,這明顯不礙于項目的開發和維護。所以前后端分離的概念就是,前端做前端的事,包括界面的展示,數據請求,邏輯處理,路由等;而后端只是提供數據接口而已。

? ? ? ? ? 把話題回歸到主題上。前面也說過瀏覽器渲染有兩種,前端模板引擎或用JS。對于MV*框架(數據和展示分離)的單頁面應用(SPA),它們的頁面都是通過JS 渲染而成,屬于瀏覽器渲染。所以使用這種方式的弊端在于網站的搜索引擎優化,因為網絡爬蟲是不讀區JS文件的。

? ? ? ? ? 服務端渲染:用后臺語言通過模版引擎生成html,如:PHP文件、JSP文件、Python的Flask配合Jinja引擎、Django框架、Java配合vm模版引擎、NodeJS配合Jade.適合多頁面應用。目前大部分網站還是這種形式。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 在網上查找了很久的前端渲染和后端渲染的區別,最后總算在知乎上看到了一個比較清楚的解釋,感謝萬分! 作者:iakul...
    牧碼人小鵬閱讀 14,761評論 3 7
  • 當學會向內看,當知曉“我是一切的根源”,心靈的被告一個個少去,最后發現自己成了眾矢之的,站在被告席上的是我的內在小...
    Looloo閱讀 211評論 0 1
  • 1.安裝 2.配置php模塊 3.運行在nginx服務器上的php文件mkdir創建文件失敗 原因:服務器用戶組沒...
    Mr_Laoyu閱讀 335評論 0 0
  • 和你相遇 是命運安排的邂逅 與你同行 愿這路沒有盡頭 想對你說甜言蜜語 卻張口結舌 因為所有的甜言蜜語都抵不過你在...
    瓊圖閱讀 216評論 0 1