首頁常見問題正文

服務(wù)器端渲染是什么【W(wǎng)eb前端培訓】

更新時間:2022-08-22 來源:黑馬程序員 瀏覽量:

IT培訓班

  Vue進行服務(wù)器端渲染時,需要利用Node.js搭建一個服務(wù)器,并添加服務(wù)器端渲染的代碼邏輯。使用webpack-dev-middleware中間件對更改的文件進行監(jiān)控,使用webpack-hot-middleware中間件進行頁面的熱更新,使用vue-server-renderer插件來渲染服務(wù)器端打包的bundle文件到客戶端。

  服務(wù)器端渲染具有哪些優(yōu)點?

  如果網(wǎng)站對SEO(搜索引擎優(yōu)化)要求比較高,頁面又是通過異步來獲取內(nèi)容,則需要使用服務(wù)器渲染來解決此問題。

  服務(wù)器端渲染相對于傳統(tǒng)的SPA(單頁面應(yīng)用)來說,主要有以下優(yōu)勢。

  (1)利于SEO

  Vue SSR利用Node.js搭建頁面渲染服務(wù),在服務(wù)端完成頁面的渲染(把以前需要在客戶端完成的頁面渲染放在服務(wù)器端來完成),便于輸出SEO更友好的頁面。

  (2)首屏渲染速度快

  在前后端分離的項目中,前端部分需要先加載靜態(tài)資源,再采用異步的方式去獲取數(shù)據(jù),最后來渲染頁面。其中,在獲取靜態(tài)資源和異步獲取數(shù)據(jù)階段,頁面上是沒有數(shù)據(jù)的,這將會影響首屏的渲染速度和用戶體驗。

  而使用服務(wù)器端渲染的項目,特別是對于緩慢的網(wǎng)絡(luò)情況或運行緩慢的設(shè)備來說,無須等待所有的JavaScript都完成下載并執(zhí)行,才會顯示服務(wù)器渲染的標記,這使得用戶將會更快速地看到完整渲染的頁面,將會大大提升用戶體驗。

  服務(wù)器端渲染的不足是什么?

  雖然服務(wù)器端渲染有首屏加載速度快和有利于SEO的優(yōu)點,但是在使用服務(wù)器端渲染的時候,還需要注意以下兩點事項。

  (1)服務(wù)器端壓力增加

  服務(wù)器端渲染需要在Node.js中渲染完整的應(yīng)用程序,這會大量占用CPU資源。如果在高流量的環(huán)境下使用,建議利用緩存來降低服務(wù)器負載。

  (2)涉及構(gòu)建設(shè)置和部署的要求

  單頁面應(yīng)用程序可以部署在任何靜態(tài)文件服務(wù)器上,而服務(wù)器端渲染應(yīng)用程序,需要運行在Node.js服務(wù)器環(huán)境。

分享到:
在線咨詢 我要報名
和我們在線交談!