一、减小入口文件体积
常用的手段是路由懒加载，把不同路由对应的组件切割成不同的代码块，待路由被请求的时候会单独打包路由，使得入口文件变小，加载速度大大增加。
在vue-router 配置路由的时候，采用动态加载路由的形式，这样就可以把各自的路由文件分别打包，只有在解析给定的路由时，才会加载路由组件。
二、静态资源本地缓存
后端返回资源问题：
（1）采用HTTP缓存，设置Cache-Control, Last-Modified,Etag等响应头
（2）采用Service Worker离线缓存
前端合理利用 localStorage
（3）UI框架，组件按需加载
在日常使用UI框架，例如element-UI、或者antd,我们经常性直接引用整个UI库，但实际上我们用到的组件只有按钮，分页，表格，输入与警告，所以我们按需引用
（1）采用HTTP缓存，设置Cache-Control, Last-Modified,Etag等响应头
（2）采用Service Worker离线缓存
前端合理利用 localStorage
（3）UI框架，组件按需加载
在日常使用UI框架，例如element-UI、或者antd,我们经常性直接引用整个UI库，但实际上我们用到的组件只有按钮，分页，表格，输入与警告，所以我们按需引用
子组件引用时也可以采用import()的按需加载的方式，这样能使打包时，分包打包
三、webpack打包时，采用分包机制，config配置中使用分包机制，降低chunk包大小
四、组件重复打包
假设A.js文件是一个常用的库，现在有多个路由使用A.js文件，这就造成了重复下载，解决方案：在webpack的config文件中，修改CommonsChunkPlugin的配置
config中minChunks设置为3表示会把使用3次及以上的包抽离出来，放进公共依赖文件，避免了重复加载组件
五、图片资源压缩
图片资源虽然不在编码过程中，但它却是对页面性能影响最大的因素，对于所有的图片资源，我们可以进行适当的压缩。 对页面上使用到的icon，可以使用在线字体图标，
或者雪碧图，将众多的小图标合并到同一张图上，用以减轻http请求压力。
六、开启Gzip压缩拆完包之后，我们在用gzip做一下压缩 安装compression-webpack-plugin，在服务器我们也要做相应的配置