vue项目白屏的原因及优化

一、原因：

单页面应用的 html 是靠 js 生成，因为首屏需要加载很大的js文件(app.js 和vendor.js)，所以当网速差的时候会产生一定程度的白屏

二、解决办法：

1、路由懒加载，组件懒加载

1.路由懒加载

// 1、Vue异步组件技术：
{
  path: '/home',
  name: 'Home',
  component: resolve => require(['../views/home.vue'], resolve)
}

// 2、es6提案的import()
{
  path: '/',
  name: 'home',
  component: () => import('../views/home.vue')
}

// 3、webpack提供的require.ensure()
{
  path: '/home',
  name: 'Home',
  component: r => require.ensure([],() =>  r(require('../views/home.vue')), 'home')
}

2.组件懒加载

components:{
  "da