1. 服務端渲染(SSR)
本文主要探討了服務端渲染(SSR)的概念、與瀏覽器端渲染(CSR)的對比、不同渲染方式在瀏覽器解析情況、實現SSR的方法、構建流程剖析、編寫通用代碼、數據預取存儲容器、伺服器部署等內容。
首先，解釋了CSR（Client Side Render）和SSR（Server Side Render）的概念。CSR指的是頁面內容由瀏覽器端的JavaScript文件渲染出來，而SSR則是在服務端渲染頁面內容，直接將HTML返回給瀏覽器顯示。在Vue.js框架中，CSR默認情況下會在瀏覽器中輸出Vue組件，而SSR則允許將同一組件渲染為伺服器端的HTML字元串。
接著，文章介紹了通過Express框架實現簡單的Node服務，以及利用vue-server-renderer提供的createRenderer將Vue與Node結合，實現服務端渲染。具體步驟包括讀入頁面模板、引入打包好的伺服器端構建文件、使用webpack在Node.js中實現實時輸入的內存bundle（非生產環境），以及調用watch方法監聽文件變更以觸發webpack編譯。
在構建流程方面，文章詳細介紹了通用配置、伺服器配置、客戶端配置等步驟，以及如何生成客戶端清單（client manifest）來自動推斷和注入資源預載入/數據預取指令，以及css鏈接/script標簽到渲染的HTML中。通過客戶端清單和伺服器bundle，渲染器可以自動推斷並注入預載入指令，從而優化載入性能。
為了編寫通用代碼，文章強調避免使用瀏覽器特有的API（如window或document），並提出了解決方案。接著，文章深入探討了服務端數據預取（Server entry）和客戶端數據預取（Client entry）的過程，以及如何監聽路由鉤子以獲取非同步數據進行客戶端渲染。
伺服器部署部分，文章介紹了使用pm2進程管理工具，以及如何以cluster模式啟動服務，實現自動重啟功能。同時，文章還提到了通過nginx作為反向代理伺服器，以及修改DNS解析以實現域名映射。最後，文章提供了官方demo的參考源碼。