# MotionActor > A generator-driven actor runtime for deterministic, frame-based video. ## Docs - [Introduction](https://docs.motion.actor/docs): MotionActor runs a TypeScript generator once, records the motion it describes, and reads any frame of that record on demand. ## Start here - [Quickstart](https://docs.motion.actor/docs/getting-started): Write a scene, read a frame from it, draw it with a renderer and play it in a host. - [How it works](https://docs.motion.actor/docs/mental-model): Scene code runs once at compile time or once per frame at resolve time, and a renderer only reads the result. ## Reference ### Reactivity - [Reactivity](https://docs.motion.actor/docs/reactivity): Where each of an actor's values comes from, and the primitive that declares it. #### State - [signal](https://docs.motion.actor/docs/reactivity/signal): A value the scene writes. set, tween, play, animate, transition and derive record each write at the cursor. - [reactiveSignal](https://docs.motion.actor/docs/reactivity/reactive-signal): One nested value, written leaf by leaf or as a whole. - [group](https://docs.motion.actor/docs/reactivity/group): Names a set of fields, so an actor reads card.typography.size and spawns with nested inputs. #### Computed values - [derived](https://docs.motion.actor/docs/reactivity/derived): A read-only value computed from other reads each time a frame resolves. #### Inputs and coordination - [channel](https://docs.motion.actor/docs/reactivity/channel): A value the host publishes while frames play, such as a measured width, read when a frame resolves. - [watch](https://docs.motion.actor/docs/reactivity/watch): Runs a handler while the scene compiles, each time a value the actor reads changes. - [Events and subscribe](https://docs.motion.actor/docs/reactivity/events-and-subscribe): An actor announces what happened with a typed event; subscribe attaches another actor's response. ### Runtime - [Runtime](https://docs.motion.actor/docs/runtime): How a scene script becomes a timeline, how frames resolve from it, and how actors host one another. #### Scenes - [Scene orchestration](https://docs.motion.actor/docs/runtime/scene-orchestration): A scene script runs once, moving a cursor through time while it spawns actors and records their motion. - [Compiled scenes](https://docs.motion.actor/docs/runtime/compiled-scene): Turning a frame number into state, finding actors in it, caching it and reflecting it for editors. - [Determinism](https://docs.motion.actor/docs/runtime/determinism): What a frame may depend on, what quietly breaks that, and how values from the host get in safely. #### Structure - [Slots](https://docs.motion.actor/docs/runtime/slots): A slot is a place in an actor that other actors are spawned into, in an order the scene controls. - [Children](https://docs.motion.actor/docs/runtime/children): A child is a part every instance of an actor has, spawned with it and able to read it. ### Actors - [Actors](https://docs.motion.actor/docs/actors): The two base classes, the actors that ship with MotionActor, and the decorator that labels a command for editors. #### Base classes - [Actor](https://docs.motion.actor/docs/actors/actor): The base class. An actor owns state, the commands that change it over time, and hooks for entering and leaving a scene. - [LayoutActor](https://docs.motion.actor/docs/actors/layout-actor): The base class for anything drawn on the stage. It adds a box, a transform, opacity, compositing and a measured size. #### Built-in actors - [Camera2D](https://docs.motion.actor/docs/actors/camera2d): The scene camera from @motionactor/primitives. It pans, zooms, rolls, frames a box, follows an actor and shakes. - [ClockActor](https://docs.motion.actor/docs/actors/clock-actor): A stopwatch whose elapsed time is computed from the frame, from @motionactor/primitives. - [ComponentActor](https://docs.motion.actor/docs/actors/component-actor): An actor whose only state is a React function, from @motionactor/primitives. It draws from the frame number. - [Audio and sound effects](https://docs.motion.actor/docs/actors/audio): Audio plays one clip along the timeline. AudioManager schedules short cues, by name or in answer to another actor's events. #### Authoring - [@command](https://docs.motion.actor/docs/actors/command): Labels a generator method for editors, with its parameters and a default duration, so a timeline can offer it without knowing the class. ### Rendering - [Rendering](https://docs.motion.actor/docs/rendering): How a resolved frame becomes pixels, through renderers, backends, layers, compositions and the hosts that play them. #### Drawing - [Renderers](https://docs.motion.actor/docs/rendering/renderers): A renderer draws one actor class on one backend from the resolved state of one frame. - [Backends and layers](https://docs.motion.actor/docs/rendering/backends-and-layers): The DOM, Pixi, Three.js and Skia backends, and how a scene splits its stage between them. - [Media, assets and fonts](https://docs.motion.actor/docs/rendering/media-assets-and-fonts): How a scene names files, how hosts load them, and how video and audio play frame by frame. #### Effects and transitions - [Effects](https://docs.motion.actor/docs/rendering/effects): An effect is a timed record on an actor that the actor's backend paints, with typed params a scene can tween. - [Transitions](https://docs.motion.actor/docs/rendering/transitions): One command morphs the tree before a change into the tree after it, matched by shared element names, and every frame of it scrubs. #### Playback and export - [Compositions](https://docs.motion.actor/docs/rendering/compositions): A composition packages a scene with its size, frame rate, render runtime and props, so any host can build and play it. - [Hosts](https://docs.motion.actor/docs/rendering/hosts): A host owns the clock. It picks a frame, waits until the frame is ready, then shows or captures it. - [Playing in the browser](https://docs.motion.actor/docs/rendering/playing-in-the-browser): SceneMedia plays a compiled scene behind Video.js controls. - [Capture and export](https://docs.motion.actor/docs/rendering/capture-and-export): Read finished frames as pixels, encode stills, and write a video file from a mounted composition. #### Other frameworks - [Vue](https://docs.motion.actor/docs/rendering/vue): Paint scenes with Vue 3 through @motionactor/renderers/vue and @motionactor/dom/vue. - [Svelte](https://docs.motion.actor/docs/rendering/svelte): Paint scenes with Svelte 5 through @motionactor/renderers/svelte and @motionactor/dom/svelte. #### Writing a backend - [Writing a backend](https://docs.motion.actor/docs/rendering/writing-a-backend): Build a backend for another drawing surface, with a host, renderers and an effect kind of its own. - [Effect kinds](https://docs.motion.actor/docs/rendering/writing-a-backend/effects): Define an effect kind for SVG filters, with a stage that paints its effects. - [Holding a frame](https://docs.motion.actor/docs/rendering/writing-a-backend/frames): Hold a frame while a texture, font or shader loads, and carry the frame context into another React reconciler. ## Build ### Guides - [Guides](https://docs.motion.actor/docs/guides): Writing an actor from state to renderer, and testing a scene without drawing it. - [Creating actors](https://docs.motion.actor/docs/guides/creating-actors): One actor from its state to its renderer, with signals for what the scene writes, derived values for what gets drawn and commands for motion. - [Testing](https://docs.motion.actor/docs/guides/testing): Compile a real scene, resolve frames and assert on what they hold, with no renderer, browser or hand-built fixture. ### Examples - [Examples](https://docs.motion.actor/docs/examples): A small complete Remotion composition, and a real library actor at full size. - [Remotion card](https://docs.motion.actor/docs/examples/remotion-card): A complete Remotion composition in two files, with a declared child, a derived value read against the viewport and typed scene exports. - [Desktop](https://docs.motion.actor/docs/examples/desktop): A real library actor end to end, with signals for state, derived chains for presentation, slots for hosted apps and generator commands for motion. ## Ecosystem - [Packages](https://docs.motion.actor/docs/packages): What each @motionactor package holds and which ones an app needs. - [Component library](https://docs.motion.actor/docs/component-library): Actor families and effects, distributed as a shadcn registry that copies their source into your repo. ## Agent resources - [llms-full.txt](https://docs.motion.actor/llms-full.txt): The full Markdown of every page in one file. - [Page Markdown](https://docs.motion.actor/index.md): Append `.md` to any page URL to fetch that page as raw Markdown. - [JSON API](https://docs.motion.actor/api/docs/pages.json): Page index of the JSON docs API; each entry links the page's JSON and Markdown forms. Described by the OpenAPI document at https://docs.motion.actor/openapi.json. - [MCP server](https://docs.motion.actor/mcp): Streamable HTTP Model Context Protocol server with search_docs, get_page, list_pages, and get_navigation tools, plus every page as a resource. Discovery document: https://docs.motion.actor/.well-known/mcp.json - [Agent skills](https://docs.motion.actor/.well-known/agent-skills/index.json): Agent Skills discovery index of the skills this site publishes. - [API catalog](https://docs.motion.actor/.well-known/api-catalog): RFC 9727 linkset of the APIs documented here. - [AI catalog](https://docs.motion.actor/.well-known/ai-catalog.json): ARD manifest of the agent-facing resources on this site (MCP server, skills, APIs). - [agent-readability.json](https://docs.motion.actor/agent-readability.json): Manifest of every agent-facing artifact on this site. - [Sitemap](https://docs.motion.actor/sitemap.xml): Every indexable page URL with its last-modified date.