认识虚拟dom

1. 为什么需要虚拟dom？

• 真实的dom操作是很慢的，而js是很快，直接操作dom可能会导致频繁的回流与重绘，js不存在这些问题。因此虚拟dom比原生dom更快。
• jquery不能从根本上解决dom操作量过大情况下的前端侧的压力。

工作流: 构建新的dom树 – 通过diff对比出新旧两棵树的差异–差异更新DOM
缺点：虚拟dom的劣势主要在于js计算的耗时DOM操作的能耗和js计算的能耗根本不在一个量级。

2. dom操作解决方法 - 模板引擎

• 读取html模板并解析它，分离出其中的js信息。
• 将解析出的内容拼接成字符串，动态生成js代码。
• 运行动态生成js代码，吐出目标html。
• 将目标html绘制成innerHTML，触发渲染流水线完成真实dom的渲染。

工作流：动态生成html字符串（构建新的真实dom）-- 旧的dom元素整体被新的DOM元素替换
缺点：性能一般，每次重新渲染都会把之前的删掉重新渲染整个。局限在实现高效的字符串拼接上

3. 解决的关键问题

• 研发体验/研发效率的问题
• 跨平台的问题
• 批量更新 在通用的虚拟dom库是有batch函数来处理的。batch的作用是缓冲每次生成的补丁集

每次setState的时候只修改少量的数据，模板渲染和虚拟dom之间dom操作量级的差距完全拉开，虚拟dom将在性能上具有绝对的优势。
性能问题不能一概而论，jquery，原生dom在思维模式上来说虚拟dom截然不同，强行比较意义不大。虚拟dom的价值不在于性能。