一.源码优化

1.代码模块化，封装成单独的组件，复用性越高越好，可配置型越强越好，包括css也可以通过less和sass的自定义css变量来优化

2.设置key 值，不仅仅是v-for ，由于vue 内部 diff算法，例如 动态加载的 表单

3.Vue路由，组件 设置成懒加载，当首屏渲染的时候，能够加快渲染速度。（require, import）

4.理解Vue的生命周期，不要造成内部泄漏，使用过后的全局变量在组件销毁后重新置为null

5.keep-alive对组件进行缓存。

6.对于频繁切换的组件使用v-show

二．打包优化

1.修改vue.config.js中的配置项，把productionSourceMap设置为false，不然最终打包过后会生成一些map文件，并且在生成环境是可以通过map去查看到源码的，这样会造成源码泄漏。productionGzip设置为true可以开启gzip压缩，使打包过后体积变小。

2.使用cdn的方式外部加载一些资源，比如vue-router、axios等Vue的周边插件,在webpack.config.js里面，externals里面设置一些不必要打包的外部引用模块。然后在入门文件index.html里面通过cdn的方式引入需要的插件。

3.减少图片使用，可以用一些css3的效果来代替图片效果，或者使用雪碧图来减少图片的体积。使用icon-font

参考 https://zhuanlan.zhihu.com/p/121000054