React：真正理解虚拟DOM_virtual dom的渲染机制?

在mvvm这个框架领域，到现在仍然存在一个及其热门的面试问题：为什么要使用虚拟DOM？

一般的回答如下：

本文将通过另一个视角，给出不同的答案，本文不局限于点对点看待问题本硕本身，而是放在一个足够长的、合理的上下文中进行讨论。

什么是虚拟 DOM？

在 React 中，render 执行的结果得到的并不是真正的 DOM 节点，结果仅仅是轻量级的JavaScript 对象，我们称之为 virtual DOM。虚拟DOM本质上是JS和DOM之间的映射缓存，在形态上是一个能够描述DOM结构的JS对象。

虚拟 DOM 是 React 的一大亮点，具有 batching(批处理) 和高效的 Diff 算法。这让我们可以无需担心性能问题而” 毫无顾忌” 的随时“ 刷新” 整个页面，由虚拟 DOM 来确保只对界面上真正变化的部分进行实际的 DOM 操作。在实际开发中基本无需关心虚拟 DOM 是如何运作的，但是理解其运行机制不仅有助于更好的理解 React 组件的生命周期，而且对于进一步优化 React 程序也会有很大帮助。

虚拟DOM在在挂载阶段和更新阶段分别的作用如下：

历史长河中的DOM操作解决方案

原生JS下“人肉DOM”时期

此时前端页面的“展示”属性远远高