今天读Vue文档的时候仔细看了一下异步组件部分，第一次看的时候一脸懵逼，看第二次还是有点迷茫，第三次就有点感觉了，第四次感觉有点明白了，遂记录一下我自己的理解，可能是错的，希望大佬们可以指点迷津，也百度谷歌了一下，有对异步加载的使用进行描述的，但是感觉没有进行分析的，所以还是有一些困惑
Vue异步组件
为什么需要异步组件，道理和webpack的按需加载是一样的，如果一开始就加载所有的组件，那么是比较耗时的，所以我们可以将一些组件定义为异步组件，在需要使用的时候再进行加载。
所以好处的话就显而易见了 ：
- 按需加载，可以节省首次加载的时间，提高速度，也算是一个性能优化。
- 那么一个组件可能会被使用多次，按需加载的话也不会加载多次，第一次加载完成就会缓存下来，和webpack是一样的，所以不用担心
好了，装逼结束，接下来一起来读文档吧
文档搬运
文档对异步组件的描述是这样的：
- Vue 允许将组件定义为一个异步解析组件定义的工厂函数。Vue 只在实际需要渲染组件时，才触发调用工厂函数，并且会将结果缓存起来，用于将来再次渲染。
以及这样的：
- 工厂函数接收一个 resolve 回调函数，在从服务器接收到组件定义时调用。也可以调用 reject(reason) 表明加载失败。
还有这样的：
- 要使用异步组件，一个比较推荐的方式是配合 webpack 代码分离功能 。
下面是文档中的栗子：
Vue.component('async-webpack-example', function (resolve) {
// 这个特殊的 require 语法
// 将指示 webpack 自动将构建完成的代码，
// 拆分到不同的 bundle 中，然后通过 Ajax 请求加载。
require(['./my-async-component'], resolve)
})
好吧，我连注释都没删，但是第一次看是比较懵逼的，看不懂。不过多读两遍就好了。
抛砖引玉
Vue 只在实际需要渲染组件时，才触发调用工厂函数
我是这么理解的（纯属虾米扯着蛋了）：
-
上面的代码中是已经在注册了一个全局的组件名字叫"async-webpack-example"。
-
这个已经注册的组件是只有一个名字的，是没有实体的，就像一个空壳，等着被填充。
-
当我们在使用到这个组件的时候，就调用上面代码中的工厂函数，然后就触发webpack的异步加载模块方法，详情可以去看webpack文档中的代码分割部分，或者等着看我的文章《webpack如何实现按需加载》。
-
此时就会去异步的请求一个模块，当请求成功后，这个模块的内容就是“async-webpack-example”组件的实体部分，(还有个回调函数，感觉没啥用......乱说的不要打我)那么到了这一步，我们在使用到"async-webpack-example"组件的地方就完成了由只有一个组件名，到异步加载实体内容这么一个过程，并在相应的地方进行内容渲染，也就是所谓的异步加载组件，然后加载的内容就会被缓存下来。
遗言
当然异步加载组件不是只有只用webpack一种方式，就像你加载js模块一样，方式不是唯一的，文档里面还介绍了使用webpack2+es6的语法
呃。。。。还是需要webpack，不过重点是es6的语法，就自己去看文档吧。
上面的代码是注册全局异步组件，如果是局部注册的话，我相信应该也不难，算了，我觉得很多人和我一样懒，我就写一下吧：
new Vue({
// ...
components: {
'my-component': function(resolve){
require(['./my-async-component'], resolve)
}
}
})
如果你是需要使用异步组件的 Browserify 用户，可能就无法使用异步组件了，它的作者已经明确表示很不幸 Browserify 是不支持异步加载的。Browserify 社区找到一些解决方案，这可能有助于现有的复杂应用程序实现异步加载。对于所有其他场景，我们推荐直接使用 webpack 所内置的一流异步支持。
还有就是在高级的异步组件里，工厂对象可以返回一个对象，对象里面是一些配置参数，比如加载组件，在请求过程中应该先加载一个什么组件让用户先乐乐，请求发生错误的时候加载什么组件让用户谅解，等等自己去看吧
有相信有很多地方我理解的不是很到位，乃至理解根本是错的，希望大佬们别给面子都指出来
恩，over......
