React 的虚拟 DOM

Question

我知道这可能是重复的，但我真的很难理解 React 的协调算法的这一部分。 所以 Virtual DOM 是 Real DOM 的 memory 表示。 每当我们调用 setState() 时，React 会创建另一个 Virtual DOM 副本并将其与前一个副本进行比较，或者它会更改现有的 Virtual DOM 并将其与 Real DOM 进行比较？

Answer 1

仅在 Virtual DOM 实例中进行或比较任何更改。

当您执行 setState 时，React 会创建另一个具有所需更改的虚拟 DOM 副本，并比较旧的和当前的虚拟 DOM 以仅在浏览器中的实际 DOM 中应用更改

您可以在 React 文档中阅读有关Virtual DOM and its implemntation的更多信息

根据反应文档中的 Reconcilation 链接

Reconciliation是被普遍理解为“虚拟 DOM”的算法。 一个高级描述是这样的：当你渲染一个 React 应用程序时，一个描述应用程序的节点树会生成并保存在 memory 中。 然后将该树刷新到渲染环境——例如，在浏览器应用程序的情况下，它被转换为一组 DOM 操作。 当应用程序更新时（通常通过 setState），会生成一个新树。 新树与之前的树进行比较，以计算更新渲染应用程序所需的操作。