7、SSR（服務端渲染）

使用框架的問題

下載Vue.js

執行Vue.js

生成HTML頁面（首屏顯示，依賴於vue.js的加載）

之前沒有前端框架時，用jsp/php在服務器端進行數據的填充，發送給客戶端就是已經填充好的數據的HTML。首屏就沒有問題

如今尼，使用JQuery異步加載數據，使用React和Vue前端框架，可是須要等待框架加載出來，首屏才顯示，首屏渲染有問題，首屏性能會降低。因此須要想辦法，在vue.js層面進行首屏的優化。

多層次的優化方案

• 構建層模板編譯。vue2.0將Vue拆成runtime和compile兩個包，在webpack構建的時候，統一將工程的全部template相關的模板語法，在構建的時候編譯成runtime能夠執行的代碼。在瀏覽器執行的過程當中，就不須要再進行模板編譯的過程。
• 數據無關的頁面作一個prerender。用戶營銷頁面，全部用戶看到的頁面都是同樣的，那麼將這個頁面在構建層徹底執行掉，render掉，生成一個直出的HTML。那麼在瀏覽器端不須要vue.js。
• 服務端渲染。像用戶中心這個頁面，在服務端拿到這個我的中心的數據，在服務端將這個頁面渲染掉，那麼在瀏覽器獲得的就是直出的HTML，在瀏覽器端就能夠直接渲染頁面。