vue性能优化方案，解决首页加载慢

首页加载速度非常慢，如果项目比较大，升值可能出现10s以上的等待。用户体验非常差，解决方式

1、路由懒加载

此方法会把原本打包到一个app.js的文件分开成多个js文件打包，这样会减小单个文件的大小，但不会减小整个js文件的大小。

通过这种方式可以做到按需加载，只加载单个页面的js文件

2、打包文件中去掉map文件

打包文件的app.js过大，另外还有一些生成的map文件，先将多余的map文件取代哦，找到config文件夹下的index.js文件，把这个build里面的productionSourceMap改成false即可

3、CDN引入第三方库

在项目开发中，我们会用到很多第三方库，如果可以按需引入，我们可以引入自己需要的组件，来减少所占空间，但也会有一些不能按需引入，我们可以采用CDN外部加载，在index.html中从CDN引入组件，去掉其它页面组件import，修改webpack.base.config.js，在externals中加入该组件，这是为了避免时找不到组件报错

4、gzip打包

gizp压缩是一种http请求优化方式，通过减少文件体积来提高加载速度。html,css,js文件甚至json数据都可以用它压缩，可以减小60%以上的体积

5、预渲染 

如果前端页面100多个，比较大的项目，可能还是会有点慢。上面都是基于js执行完以后进行的渲染，如果想要快一点，还有两种方案，一种是ssr也就是服务端渲染，一种是预渲染。

预渲染是js加载前，就生成了一个首页静态页面，用于加载，不会让你等着，预渲染依赖的是prerender-sap-plugin插件，使用起来也非常简单，但是坑非常多，一个地方尊重不到就会报错：