一.問題描述：通過原生檢查日誌在網絡不好的情況下，h5頁面白屏是由於vue打包後的第三方js包加載失敗導致。
二.解決方案：
1.減少第三方依賴：在package.json中把不需要的包刪除。
2.組件化：項目中將能複用的部分組件化。
3.webpack實現vue代碼分隔和懶加載：路由懶加載和組件按需加載。
(1).路由懶加載
// r就是resolve
const list = r => require.ensure([], () => r(require('../components/list/list')), 'list');
// 路由也是正常的寫法 這種是官方推薦的寫的 按模塊劃分懶加載
const router = new Router({
routes: [
{
path: '/list/blog',
component: list,
name: 'blog'
}
]
})
(2).組件按需加載
將import page1 from '@/page/page1' 改爲 const page1 = () => import('@/page/page1')
4.使用vue骨架屏：在頁面內容未加載完成的時候，先使用一些圖形進行佔位，待內容加載完成之後再把它替換掉，即在index.html中的div#app內直接插入骨架屏相關內容即可。
5.ssr服務端渲染和nsr原生渲染。
ssr渲染：（1）使用node.js作爲轉發層
（2）node服務從java獲取數據，這一階段的耗時主要取決於node服務與java服務的通信時間。
（3）node服務將ajax返回的數據，和初始化完css數據、meta、title等信息的html基礎結構，以及html字符串中標籤上的方法綁定和外鏈js代碼執行等拼裝好返回給客戶端進行解析。