Ambient Element

Element 是为 Ambient 运行时提供的受 React 启发的虚拟树库。

它由 Ambient ECS 支持；虚拟树被转换为实际的实体和组件树。当树更新时，它会与之前的树进行比较，并且只应用差异到 ECS。这可以用于 UI，以及任何其他希望能够高效更新的树形数据结构。

Element 模块紧密模仿 React 并使用 Hooks。在这里，React 组件被称作 ElementComponent（因为 Component 已被 ECS 使用）。这里有一些概念需要关注

• Entities（React：DOM 节点）只是普通的 ECS 实体，它们是此模块所有工作的“结果”。
• Element（React：Element）。这基本上是关于 Entity 或 ElementComponent 的描述。您可以在其上设置常规 ECS 组件（例如 .set(translation(), ..)）。Element 可以有子元素，这些子元素将被转换为实体的 children() 组件。
• ElementComponent（React: Component）基本上是一个函数，它接受一些用户输入加上钩子（实例的局部状态）并从这个生成元素树。 ElementComponent可以相互包裹，例如，外层的ElementComponent可以返回一个元素，内层的ElementComponent只向其中添加一个组件。在这种情况下，只有一个元素，尽管有两个ElementComponent。 （即ElementComponent和Element之间没有一一对应的关系）。
• ElementInstance（React: Instance）是Element的实例（记住，Element只是描述）。它有一个对其“拥有”的实体的引用。当使用钩子时，状态存储在ElementInstance上。
• ElementTree是ElementInstance的树。

更多信息

• https://reactjs.ac.cn/blog/2015/12/18/react-components-elements-and-instances.html