Three Start
API Reference

ThreeContext

The shared runtime for a scene — renderer, camera, loop, events, and modules.

ThreeContext is the single runtime object for a scene. It holds the renderer, scene, camera, animation loop, timer, and event bus.

You don't construct ThreeContext directly — it's created automatically inside ThreeStart and exposed via its ctx field.

Every Object3DBehaviour and ContextModule instance has access to the same context via this.ctx.

Properties

Prop

Type

Methods

Prop

Type

Events

ThreeContext extends TypedEmitter and acts as the central event bus of the runtime — subscribe via ctx.on(...), unsubscribe via ctx.off(...). Events are typed by ThreeContextEventMap below.

Prop

Type

ThreeContextEventMap

EventDetails
ThreeContextEvents.Update
Fired once per animation frame, before RenderBefore and rendering. Driver of all per-frame logic.
ThreeContextEvents.RenderBefore
Fired once per animation frame, just before the scene is rendered. Use to mutate state right before draw.
ThreeContextEvents.RenderAfter
Fired once per animation frame, immediately after the scene is rendered.
ThreeContextEvents.Mount
Fired when starter.mount(container) succeeds. Carries the container element.
args: root: HTMLDivElement
ThreeContextEvents.Unmount
Fired when starter.unmount() runs.
ThreeContextEvents.Resized
Fired when the canvas container resizes (and once on first mount). Carries the new pixel dimensions.
args: width: number, height: number
ThreeContextEvents.CameraChanged
Fired when ctx.camera is reassigned. Carries the new and previous cameras.
args: newCamera: THREE.PerspectiveCamera, prevCamera: THREE.PerspectiveCamera
ThreeContextEvents.LoopRun
Fired when starter.runLoop() starts the animation loop.
ThreeContextEvents.LoopStop
Fired when starter.stopLoop() halts the animation loop.
Edit on GitHub

On this page