System Overview

Every frame in @relu-interactives/spatial-ecs is driven by a deterministic sequence of systems. This catalog lists every system shipped in the package, grouped by responsibility. Each entry links to a dedicated page with queried components, behavior notes, and ordering details.

TIP

Browsing the API? The auto-generated TypeDoc reference lives under API Reference → systems.

Entity lifecycle

• ObjectManagementSystem — core entity lifecycle: flushes the creation queue, reconciles the THREE.js scene graph hierarchy, and maintains entity/component factory registries. Runs first each frame.

Transform & visibility

• TransformSyncSystem — writes TransformComponent position, rotation, and scale to the linked THREE.js Object3D every frame.
• ObjectVisibilitySystem — syncs the Object3DRef visibility flag to the THREE.js Object3D.visible property.

Geometry & rendering

• MeshGeometrySystem — creates and updates BufferGeometry on primitive mesh entities from their MeshGeometryComponent kind and parameters.
• MaterialSyncSystem — applies MaterialComponent authoring values (type, PBR properties, texture slots) to THREE.js materials.
• LightSyncSystem — syncs LightComponent values to THREE.js light objects (directional, ambient, point, spot, hemisphere, area).
• EnvironmentSyncSystem — applies the scene-level Environment component (background, fog, HDRI) to the THREE.js scene.
• PostprocessingSyncSystem — builds and manages an EffectComposer pipeline from the Postprocessing component state.
• RenderSystem — final system in the loop; submits the frame to the WebGL renderer. Runs last each frame.

Animation

• AnimationSystem — drives the AnimationStateMachine for entities with AnimationComponent: advances the THREE.js AnimationMixer, loads clip sources, and applies cross-fade transitions.

Camera

• CameraSyncSystem — syncs CameraComponent authoring values to the live THREE.js camera (perspective and orthographic).

Physics

• PhysicsSyncSystem — initializes the Rapier physics world, creates rigid bodies and colliders from PhysicsComponent state, steps the simulation, and writes results back to entity transforms.

Audio & video

• AudioSystem — reconciles AudioComponent state with THREE.js positional audio objects. Preview mode only.
• VideoSystem — reconciles VideoComponent state with the HTML <video> element and THREE.js mesh/material. Preview mode only.

Scripting

• ScriptBehaviourSystem — dynamically imports user-authored Behaviour scripts, instantiates their classes, and drives the full lifecycle (init, onUpdate, onDestroy) each frame.

Input

• InputSystem — captures and normalizes keyboard and mouse events, exposing them via direct methods on this.world (e.g. this.world.getKey(), this.world.getMouseDown()) inside Behaviour scripts.

System execution order

Systems run in the following order each frame. You can inspect and extend this ordering via World.setup.

Order	System
1	ObjectManagementSystem
2	MeshGeometrySystem
3	(custom systems)
4	TransformSyncSystem
5	ObjectVisibilitySystem
6	LightSyncSystem
7	MaterialSyncSystem
8	CameraSyncSystem
9	EnvironmentSyncSystem
10	PostprocessingSyncSystem
11	AnimationSystem
12	PhysicsSyncSystem
13	AudioSystem
14	VideoSystem
15	ScriptBehaviourSystem
16	InputSystem
17	RenderSystem