webapck 配置方面

1.webpack 配置文件的修改 config index.js

productionSourceMap: false,

vue项目打包，打包之后js中，会自动生成一些map文件,将productionSourceMap，（在构建生产环境版本时是否开启source map）设置为false,就不会生成map文件，从而减少打包后的js代码

2.vue 路由的懒加载

在Vue router.js当中

  {
              path: "/web/im",
              component: resolve => require(["@/components/webIm"],resolve),
    },

减少 ES6 转为 ES5 的冗余代码

npm install babel-plugin-transform-runtime --save-dev

修改 .babelrc 的配置文件

"plugins": [
    "transform-runtime"
]

代码层面

v-show 和 v-if

v-if 适用于在运行时很少改变条件，不需要频繁切换条件的场景；v-show 则适用于需要非常频繁切换条件的场景。

watch 和 computed

当我们需要进行数值计算，并且依赖于其它数据时，应该使用 computed，因为可以利用 computed 的缓存特性，避免每次获取值时，都要重新计算；

当我们需要在数据变化时执行异步或开销较大的操作时，应该使用 watch，使用 watch 选项允许我们执行异步操作 ( 访问一个 API )，限制我们执行该操作的频率，并在我们得到最终结果前，设置中间状态

<keep-alive>

keep-alive 是 Vue 内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。对项目中的一些静态资源 可以加以运用

<keep-alive>
  <component>
    <!-- 该组件将被缓存！ -->
  </component>
</keep-alive>