出處：為了良好的使用者體驗和前後端分離，大多前端專案都是單頁應用，modern 框架基本都是構建客戶端應用程式的框架。通常情況下，負責在瀏覽器中輸出元件，進行生成 dom 和操作 dom 來實現使用者互動。然而，也可以將同乙個元件渲染為伺服器端的 html 字串，將它們直接傳送到瀏覽器，最後將靜態標記"混合"為客戶端上完全互動的應用程式，這就是伺服器端渲染。
更好的 seo，由於搜尋引擎爬蟲抓取工具可以直接檢視完全渲染的頁面。
單頁應用是根據路由，通過 ajax 非同步的更新頁面乙個部門來實現應用效果，這樣抓取工具是無法獲取頁面。
對於緩慢的網路或執行緩慢的裝置。可提供獲取網頁速度，有良好的使用者體驗。
由於單頁應用在第一次載入時，需要將乙個打包好（requirejs 或 webpack 打包）的 js 傳送到瀏覽器後，才能啟動應用。
所以這樣會有些慢。如果在伺服器端就預先完成渲染網頁後，直接傳送到，這樣使用者將會更快速地看到完整的渲染的頁面。通常會產生更好的使用者體驗。
可以自己實現伺服器端的渲染的 vuejs 單頁應用，也可以使用 nuxtjs 來實現，自己實現 vuejs 伺服器端渲染很繁瑣，需要熟練掌握 webpack 等工具，框架 nuxtjs 簡化了於服務端渲染的工作。
需要安裝 nodejs 建議 v8.9.4
如果nodejs版本過低可能在執行程式時，報 async read … 錯誤
然後根據一步一步的提示，來配置我們的專案。
3. 只要按提示一步一步做就可以啟動我們專案了。
啟動後在終端看到提示，恭喜您已經成功啟動了nuxt 專案
4. 輸入上圖命令，執行成功之後 則可以在瀏覽器中看到如下頁面
5. 建立好的專案結構如下圖。
6. 我們伺服器端渲染頁面都在pages資料夾中。
我們要實現當使用者在瀏覽器位址列輸入http://localhost:3000/about時要開啟about頁面
實現方式一：
在pages資料夾下建立乙個about.vue
在pages資料夾下，建立about資料夾，在資料夾內建立index.vue
恭喜您，已經實現了伺服器端渲染
/// 我們在 pages 檔案下，再建立乙個 notices 資料夾然後，在此資料夾下建立 index.vue。然後輸入以下內容。
// 元件： components/tutorial.vue
}
// 在notices資料夾下新建_id資料夾，在內新建index.vue檔案
// _id 換成別的名字，則會找不到對應頁面，所以這個名字只能是_id
剩下的 有興趣可以自己去嘗試做了～
伺服器端渲染基礎
客戶端渲染 現代化的服務端渲染 優點 1.1 使用者體驗好 1.2 開發效率高 1.3渲染效能好 1.4可維護性好 缺點2.1 首屏渲染時間長 與傳統伺服器端渲染直接獲取服務端直接渲染好的html不同,單頁面應用使用js在客戶端生成html來呈現網頁內容,使用者需要等待客戶端js解析執行完才能看到頁...
react 伺服器端渲染
伺服器端渲染 vs 客戶端渲染 1.伺服器端渲染需要消耗更多的伺服器資源 cpu，記憶體等 2.客戶端渲染可以將靜態資源部署到cdn上，實現高併發 3.服務端渲染對seo更友好 react 伺服器端渲染的實現 1.構建編譯與執行環境 安裝 babel node npm install babel c...
伺服器端渲染和客戶端渲染
網際網路早期，使用者使用瀏覽器瀏覽的都是一些沒有複雜邏輯的 簡單的頁面，這些頁面都是在後端將html拼接好的然後將之返回給前端完整的html檔案，瀏覽器拿到這個html檔案之後就可以直接解析展示了，而這也就是所謂的伺服器端渲染了。而隨著前端頁面的複雜性提高，前端就不僅僅是普通的頁面展示了，而可能新增...