第一模块：
课程名称：SpringCloud+Vertx+Disruptor 撮合交易系统实战
章节名称：2-1
讲师姓名：Gudy
第二模块：
内容概述：
2-1小节主要讲解了Vue，揭示了Vue高效的技术秘密。
第三模块：
学习心得：
第2章：
2-1 Vue高性能的秘密
前端的业务逻辑使用vue，组件库使用Element，Element是饿了么提供的一个开源组件库，本身是基于vue开发出来的，所以，可以做到无缝接入vue
真正高效的框架，一定要满足一下两个要求：
1.cpu内存友好：占用内存小，点击马上有反应
2.代码精简，可复用，编程友好
Vue设计思想/高性能秘密：
1.MVVM（运行友好）:
首先，来看没有mvvm时的前端玩法：用ajax请求后台数据，然后js更新dom
这套玩法一开始是没有问题的，但是随着“前端”变得越来越复杂，一个前端业务就涉及到几十个业务逻辑时，这套玩法就不行了，因为此时会反复出现“请求更新，请求更新”，如果只是单个页面的复杂其实还好，但是实际中，往往是需要“多页面关联更新的”，此时就比较麻烦了，这时前端程序员就要即关心“业务逻辑”，还要照顾到“显示逻辑”，这时候之前的玩法就不好用了
所以：基于这种现状，前端框架就孕育而生了，前端框架就处理一个事——显示逻辑；程序员通过使用“前端框架”，从而从显示逻辑中解脱出来，专心与业务逻辑之中。而这个框架就是MVVM模式
MVVM设计思想：
vue在vue2.0之后引入了VDOM，vdom的出现，让vue框架可以控制“页面渲染的时机”了，这让vue又提升了一个档次！
VDOM的模式：
首先，来看浏览器页面渲染时间节点图：
从上到下，经过4个节点（1、2、3的顺序不是固定的，可能同时进行，也可能交错进行），这里要注意javaScript代码在html文件的位置问题。
建议：将javaScript代码放到所有html标签的后面，因为：
浏览器的dom树引擎在初始化dom树时遇到script标签时会暂停下来，将html文件的控制权交给javaScript解析器，直到javaScript解析器解析完script代码，dom树才会继续构建
所以，一个好的建议是：将javaScript代码放到所有html标签的后面；这样页面的初始化会更快，页面也就能跟快的显示出来
DOM树：html骨架（节点）
Render树：将每个html节点的css样式挂载到dom树上，所形成的树
Layout：在浏览器的窗口上进行html节点布局
Paint：显示出布局，此时人可以看见渲染好的页面
vdom性能高的秘密：
dom更新机制：从第一步开始，把整个渲染流程1，2，3，4全部走一遍。所以，如果要对上面的那颗dom树做更新，要就要重绘（重绘就是上面的4个步骤）7次（因为有7个节点）
vdom更新机制：vdom首先会在内存中存一个dom树的副本，这个副本叫“wacth_dom_tree”,在一次操作当中，所有的dom更新都是在自己的副本中完成的，这个时候正真的dom没感觉，也就不有重绘了，此时dom树重绘的时机是：vdom中所有的dom都更新完了，在一次性将各个dom的改变都“刷”到dom树上，dom树再执行更新
效率上：将原来的7次dom树更新，降到了1次，效率大大提升！！！
所以：越复杂的页面i结构，vdom的优势就越明显，这个vdom机制是vue框架性能高的一个非常重要的原因
2.组件化（程序员友好）:对相同模块的服用
eg：左边的“小王资金账户可用资金”这一组件，在另外4个模块中都可以用，那这个“小王资金账户可用资金”就是一个可以复用的模块
这里要区分组件复用和代码复用，这事两个不同的概念：
组件复用：vue的组件复用，可以做到同一组件，同时更新到复用的模块上去！！！
这个被复用的组件，他的各个克隆体之间是存在关联关系的
可以简单的认为：在vue里面，同一个组件，在不同模块中，只有一个实例（虽然实际上并不是这样，这里只是为了更好理解）
“同一个实例的好处”：所有的更新逻辑就只有一个了，代码也更好维护
代码复用：只是代码层面的复用，在代码解析的时候，只是“静态的拷贝”了代码，这些相同的代码间是没有任何关系的，是相互独立的
小结Vue的优势/特点
MVVM：将js对象和显示逻辑进行绑定，将开发从繁重的UI中解脱了出来
组件化：高效的代码复用
第四模块：
学习截图：
随时随地看视频
