Vue性能优化之组件按需加载（以及一些常见的性能优化方法）
关于Vue中的按需加载我就简单介绍一下：大概就是我们所有的东西都会在app.js里面，但是我们并不需要把所有的组件都一次性加载进来，我们可以在需要它的时候再将它加载进来，话不多说，开车！
1、webpack2 + ES5结合开车
没发车前，我们页面加载的js是这样的：
任你随便点，你就只加载了这一个app.js文件，你所有的组件都在这里面
准备发车：把你的路由中引入组件的方式改成这样：
再来看看我们的页面上加载的js文件（开车后）：
只有当你加载了这个CityPicker组件的时候，我才引入它，也就是0.js，这就实现了异步加载，大概意思就是把我们的组件变成了一个函数，刚开始的时候它是不执行的，只有当你需要它的时候来触发它了它才会加载进来。
1、webpack代码分割结合AMD规范的require
开车前就不说了，无论你怎么挣扎，你所有的东西都在app.js里，一次性全给你加再进来，准备发车：
发车准备：把你路由里面引入组件的形式变成这样：
发车后的形态：
漂亮，同样达到了我们想要的效果
3、webpack的ensure来进行终极开车：
简单说一下它的思想：webpack编译时，会静态的解析代码中的require.ensure()，同时将模块添加到一个分开的chunk中，新的chunk会被webpack通过jsonp来按需加载。此方法内部依赖于Promise。
一共有三个参数：
参数一：字符串数组，模块的依赖项，会提前进行加载，一般情况下为空。
参数二：依赖项加载完成之后的回调函数。
参数三：chunk名。相同chunk名的文件，所有的依赖都会被放进相同的文件束中。
开始发车
发车前：将你的引入组件的方式改成这样：
发车后：
同样实现了异步加载，并且最终要的是，City就是chunk名，相同chunk名的的文件，所有的依赖都会被放到相同的文件束中。
异步加载可以大大的提高性能，避免不必要的资源浪费，今天关于vue的性能优化就先到这里，下课，额再补充几个Vue中性能优化的方法吧：
1. 可以使用computed计算属性来代替一些函数方法，（函数的话每次都会调用一次，计算属性是根据它依赖的值变化了才会执行）；
2. 对于一些不需要频繁调用的形式，使用v-if来取代v-show。（v-if的话是只有它存在了才会进行渲染，而v-show是无论如何都会渲染，只不过是将它隐藏了而已）；
3. 为item设置唯一的key值。（快速精准的定位到diff）；
4. SSR（服务器端渲染）；
5. 骨架屏加载。（在数据还没来之前显示骨架屏，提高用户体验）；
6. loading图。（提高用户体验度，用户第一）；
7. 图片按需加载，图片懒加载技术。（避免不必要的资源浪费）。
…未完待续