我们来说一下什么是 Virtual DOM，之前对这个问题，了解的不是特别的深刻，前几天在网上查找资料，加上自己的理解，来说一下这个虚拟 DOM。
React 应用是通过重复渲染来实现的用户的交互，你可能会想，这样的重复渲染会不会效率太低了，在 jQuery 的实现方式中，我们可在控制台清楚的看见，每次只有需要变化的那一个 DOM 元素被修改，可是，在 React 实现方式中，每次 render 被调用的时候，都要把整个组件都渲染一遍，这样看起来是不是有点浪费呢。
事实上不是这样的，React 利用 Virtual DOM，让每次渲染都渲染最少的 DOM 元素
要了解 Virtual DOM，首先就要了解 DOM，DOM 是结构化文本的抽象表达方式，特定与web环境中，这个结构化文本就是HTML，HTML 中的每一个元素都对应着 DOM 的每个节点，这样因为HTML中的逐级包含关系，DOM节点自然就构成了一个树形结构，称为 DOM 树
浏览器为了渲染 HTML 格式的网页，会将HTML文本解析构建 DOM 树，然后根据DOM树，来渲染用户看到的界面，当要改变界面的内容的时候，就会改变 DOM 树上的节点
Web 前端关于性能优化有一个原则，尽量减少 DOM 操作，虽然 DOM 操作知识一些简单的 JavaScript 代码，但是 DOM 操作会引起浏览器对页面进行重新布局，重新绘制，这就是比 JavaScript 语句执行慢很多的过程
总结：
既然 DOM 树是对HTML的抽象，那 Virtual DOM 就是对 DOM 树的抽象。Virtual DOM 不会触及浏览器的部分，只存在 JavaScript 树形结构中，每次自上而下的渲染React组件时，会对比这次的 Virtual DOM 和上一次渲染的 Virtual DOM，对比就会发现差别，然后就修改 DOM 树中有变化的地方就行了