虚拟 DOM 究竟存储在哪里?

IT技术 javascript reactjs google-chrome-devtools react-fiber
2021-05-25 16:18:51

我现在折磨自己几个小时,找不到答案。React 数据究竟位于什么对象/键下?我发现一个对象ReactRoot似乎存储了有关组件的所有信息,但我不知道它在窗口(我猜?)对象中的位置。

它必须在 window 对象下的某个地方,对吗?

如果您拍摄内存快照并ReactRoot从列表中选择构造函数,chrome 将在$0$0 in chrome下创建对它的引用

编辑

是否有可能以一种其他对象无法访问的方式声明 ReactRoot?这在js中怎么可能?React 没有得到浏览器的任何特殊处理,是吗?

1个回答

有一个文档解释了DOM Level 1 的基本方法。另请参阅W3CDOM Level 1 Core 规范

创建元素时,会创建该元素的新实例,但未呈现。直到您将它们包含到 DOM 树中。

浏览器将只呈现文档正文中的元素。但其他一切都只是一个对象的实例,虚拟 DOM。

// create a new Text node for the second paragraph
    var newText = document.createTextNode("This is the second paragraph.");
    // create a new Element to be the second paragraph
    var newElement = document.createElement("P");