当我们使用JSX 时
let el = <div></div>;
或
let el = React.createElement('div', ...);
(它们完全相同，AFAIK)。el或<div></div>是虚拟DOM(元素)，还是虚拟DOM意味着其他东西？所以我的问题是，<div></div>会成为虚拟DOM的一部分吗？React.createElement()创建一个对象。这个对象会成为虚拟DOM(树)的一部分吗？
我想知道虚拟DOM是指整个树还是存储所有元素的虚拟文档对象模型。当我们说ReactDOM.render(<Foo />, rootEl)时，它将虚拟DOM元素呈现为虚拟DOM树和实际DOM树。(就像let el = document.createElement()创建实际的DOM元素，document.body.appendChild(el)将DOM元素添加到DOM树中一样。)所以<div></div>或React.createElement('div', ...)创建的东西将成为虚拟DOM的一部分。
当您使用React.createElement()†时，您可以创建要渲染的元素的描述：
> React.createElement('div', [], "Hello, world!");
{ '$$typeof': Symbol(react.element),
type: 'div',
key: null,
ref: null,
props: { children: 'Hello, world!' },
_owner: null,
_store: {} }
这些元素中的每一个都可以依次渲染其他元素以形成树。
当您将根节点传递给ReactDOM.render()(和朋友)时，ReactDOM会将元素的描述转换为初始呈现，并将其插入到DOM中。
当树中发生更新时，React将重新渲染其所有子代(只有少数例外)，并且通过一个名为"协调"的过程，React会将新版本与其渲染的前一版本进行区分。React将获取diff并应用将旧DOM状态转换为下一个所需DOM状态所需的操作。
当我们谈论"虚拟DOM"时，DOM的当前状态表示的内存存储就是我们的意思。
使用React.createElement()是我个人认为的虚拟DOM的而不是，因为在它被传递给render()(直接或作为传递的树的一部分)之前，它实际上并不是虚拟DOM模型的一部分。
您可以在React页面上找到有关难题的信息，并在该页面上深入了解有关优化性能的信息。
脚注：
†React.createElement('div', [], 'Hello, world!');与<div>Hello, world!</div>相同。编译器将把JSX编译成一系列React.createElement调用。
它们是相同的，但当您有很多元素时，使用JSX更可读。这就是为什么它被称为语法糖，它可以帮助你拥有一个更好的结构化代码，你可以很容易地阅读。