ssr伺服器渲染是什麼

① vue項目改造SSR（服務端渲染）

缺點：1、SEO問題
2、首屏速度問題
3、消耗性能的問題

優點：
1、更好的 SEO，由於搜索引擎爬蟲抓取工具可以直接查看完全渲染的頁面
2、首屏渲染速度快

SSR 簡單來說就是將頁面在服務端渲染完成後在客戶端直接展示。

index.template.html

server.js

vue項目是通過虛擬 DOM來掛載到html的，所以對spa項目，爬蟲才會只看到初始結構。虛擬 DOM，最終要通過一定的方法將其轉換為真實 DOM。虛擬 DOM 也就是 JS 對象，整個服務端的渲染流程就是通過虛擬 DOM 的編譯成完整的html來完成的。

需要通過Webpack打包生成兩份bundle文件：
Client Bundle，給瀏覽器用。和純Vue前端項目Bundle類似
Server Bundle，供服務端SSR使用，一個json文件

不管項目先前是什麼樣子，是否是使用vue-cli生成的。都會有這個構建改造過程。在構建改造這里會用到 vue-server-renderer 庫，這里要注意的是 vue-server-renderer 版本要與Vue版本一樣。

打包之後目錄結構

vue.config.js

index.template.html

打包成客戶端和伺服器端

啟動node服務

github地址： https://github.com/wang12321/SSR