我对 react virtual DOM 的理解正确吗？

Question

我的思路：

如果我们想在 dom 元素上执行某些操作，我们可以通过：

document.getElementById("#someId").DoSomething();
document.getElementById("#someId").DoSomethingElse();

在那种情况下，浏览器需要在整个 DOM 中搜索 #someId 对象。然后它忘记元素并再次搜索以执行 DoSomethingElse()。
要解决 "forgetting and searching again" 问题，我们可以将我们的元素保存为 JavaScript object.

    var someElement = document.getElementById("#someId");
    someElement .DoSomething();
    someElement .DoSomethingElse();

更进一步，我们可以保存整个元素组或整个节点以获得更好的性能。更进一步，我们将 整个 DOM 保存为一个名为 虚拟 dom 的 JavaScript 对象。

这是理解虚拟 DOM 目的的正确方法吗？

对于新手的问题，我很抱歉，我不是前端开发人员，我只是好奇 :)

Answer 1

虚拟DOM 的要点是，实际上，您正在处理真实DOM 的副本。但是使用该副本比使用实际的 DOM 更快，因为它只有 React 实际需要的东西，将特定的浏览器问题放在一边。

使用实际 DOM 的主要问题是速度慢。至少，用那种文案工作比较快，在那里做你的工作，修改已经完成，然后你更新实际的DOM.

是的，这听起来有点疯狂，但是计算状态变化和 "just one step" 中所有变化之间的差异比用实际 DOM 进行变化更快。

此外，您在示例中仅使用了一个 DOM 节点，但您正在对 DOM 子树进行更改，这并不容易。

do I understand react virtual DOM sense correctly?