# 架构设计

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

## ECS

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

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

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

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

## 逻辑系统

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

## 节点系统

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

## 渲染系统

[渲染系统](/miniprogram/dev/reference/xr-frame/component/render/index)负责整个场景的渲染，也是最复杂的一个系统，它将[Geometry](/miniprogram/dev/reference/xr-frame/component/render/geometry)、[Effect](/miniprogram/dev/reference/xr-frame/component/render/effect)、[Material](/miniprogram/dev/reference/xr-frame/component/render/material)、[Mesh](/miniprogram/dev/reference/xr-frame/component/render/mesh)、[Texture](/miniprogram/dev/reference/xr-frame/component/render/texture)、[Light](/miniprogram/dev/reference/xr-frame/component/render/light)和[Camera](/miniprogram/dev/reference/xr-frame/component/render/camera)等组织起来，送入管线进行渲染。

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

[资源系统](/miniprogram/dev/reference/xr-frame/component/assets/index)管理整个场景的资源（注意**资源是每个场景专属的**），一般通过[`Assets`和`AssetsLoad`](/miniprogram/dev/reference/xr-frame/component/assets/elements)组件以及对应的元素在`xml`中使用，也提供手动管理的接口。同时还支持开发者自定义[Loader](/miniprogram/dev/reference/xr-frame/component/assets/loader)来增加新的资源类型。

## 动画系统

[动画系统](/miniprogram/dev/reference/xr-frame/component/animation/index)管理所有的动画，其主要实现是借由每个元素的`Animator`组件来管理下面的所有`Animation`。`Animation`本身被设计成[可扩展的](/miniprogram/dev/reference/xr-frame/component/animation/index)，框架内置了两种`Animation`来方便开发者简单使用：帧动画[Keyframe](/miniprogram/dev/reference/xr-frame/component/animation/keyframe)和[gltf动画](/miniprogram/dev/reference/xr-frame/component/gltf/specification)。

## 物理系统
[物理系统](/miniprogram/dev/reference/xr-frame/component/physics/index)目前仅管理场景中的[轮廓](/miniprogram/dev/reference/xr-frame/component/physics/shape)，以及触发轮廓点击事件。未来计划加入真实物理效果模拟，包括碰撞体和刚体等。

## AR系统

[AR系统](/miniprogram/dev/reference/xr-frame/component/ar/index)将**xr-frame**和[小程序AI系统](/miniprogram/dev/api/ai/visionkit/VKSession.md)关联起来，让AR变得十分简单易用。主系统和[ARTracker](/miniprogram/dev/reference/xr-frame/component/ar/tracker)组件协作，让开发者用几行`xml`就能实现平面跟踪、2D/3DMarker识别等功能。