# 架构设计

xr-frame使用的架构属于ECS的一种，对应于xml中，Entity就是元素，Component就是属性，System就是场景的顶层组件。这样的设计在严谨的范式下，给开发者提供了灵活的扩展能力，理论上所有的内置功能都可以由开发者在外部自己实现。

# ECS

开发者在xml中写的标签，都对应于框架里的元素Element的子类。元素本身不包含逻辑，它的逻辑全部都是被代理到其拥有的组件Component实现的。

而这个组件，在xml中对应的是元素上的属性，比如<xr-element transform="position: 1 1 1;" />，就是说在名为Element的元素上挂载了名为transform的组件。当然为了简化使用，我们还提供了一种属性代理的策略，详见Element的文档。

注意，虽然开发者会发现我们提供了手动给元素添加子节点的功能，但大部分情况下这是非法的！！！当然，出于某些场景的性能和灵活性考虑，我们提供了Shadow Element来满足开发者的需求。在所有元素的子类中，有一个是最为特殊的，它就是场景Scene，对应于xml中的xr-scene标签。设计上来讲，每个xr-frame小程序组件顶层都必须是一个xr-scene元素，其他的元素都必须被包含在其中。这是因为场景负责整个框架的调度、各个系统的挂载以及所有资源的管理。

系统，就是挂载于场景下的各个顶层组件，它们负责每个模块的管理，按照顺序驱动各个模块的运行。目前而言，所有的内置功能由以下几个系统和对应的组件们构成。

# 逻辑系统

逻辑系统负责驱动所有元素以及组件的生命周期，保证它们按顺序进行，开发者一般只需要关心组件的生命周期即可，详见Component。

# 节点系统

节点系统负责管理场景中所有3D节点的可见性，详见Node。

# 渲染系统

渲染系统负责整个场景的渲染，也是最复杂的一个系统，它将Geometry、Effect、Material、Mesh、Texture、Light和Camera等组织起来，送入管线进行渲染。

渲染管线从设计上是可定制的，未来将会逐步开放给开发者。

# 资源系统

资源系统管理整个场景的资源（注意资源是每个场景专属的），一般通过Assets和AssetsLoad组件以及对应的元素在xml中使用，也提供手动管理的接口。同时还支持开发者自定义Loader来增加新的资源类型。

# 动画系统

动画系统管理所有的动画，其主要实现是借由每个元素的Animator组件来管理下面的所有Animation。Animation本身被设计成可扩展的，框架内置了两种Animation来方便开发者简单使用：帧动画Keyframe和gltf动画。

# 物理系统

物理系统目前仅管理场景中的轮廓，以及触发轮廓点击事件。未来计划加入真实物理效果模拟，包括碰撞体和刚体等。

# AR系统

AR系统将xr-frame和小程序AI系统关联起来，让AR变得十分简单易用。主系统和ARTracker组件协作，让开发者用几行xml就能实现平面跟踪、2D/3DMarker识别等功能。