Skip to content

Modular architecture: separate core logic from PixiJS renderer to enable React Native / headless use #78

@guillempuche

Description

@guillempuche

The SDK is a single package where timeline logic, clip management, history, and events are all inside the Studio class, tightly coupled to PixiJS. This means:

  • React Native / Expo: Can't use the SDK at all. PixiJS requires HTML canvas + WebGL. Teams building cross-platform editors need to rewrite everything except the JSON format.
  • Headless / server-side: Can't run timeline logic, validate projects, or compute durations without a browser.
  • Alternative renderers: Can't swap PixiJS for Skia, Three.js, or WebGPU without forking the entire package.

What works cross-platform today

Only the data layer: IClip, ProjectJSON, ClipJSON, clipToJSON(), jsonToClip(). Everything else requires a browser.

Proposal

Split into composable packages:

@openvideo/core          Pure logic: timeline, clips, tracks, history, events
                         No browser deps. Runs anywhere (web, native, server).

@openvideo/types         Shared TypeScript interfaces (IClip, ProjectJSON, etc.)

@openvideo/renderer-pixi PixiJS renderer (current rendering, effects, transitions)
                         Depends on @openvideo/core

@openvideo/video         Full bundle (core + pixi) — backwards compatible

This would let teams:

  • Use @openvideo/core + react-native-skia for native apps
  • Use @openvideo/core on the server for validation, duration calc, headless export
  • Build custom renderers without forking

Example: what @openvideo/core would own

  • Timeline: clip scheduling, track ordering, duration calculation
  • ClipManager: add/update/remove clips (data operations)
  • History: undo/redo stack
  • EventBus: clip:added, selection:created, currentTime, etc.
  • Serialization: clipToJSON, jsonToClip, loadFromJSON, exportToJSON
  • Effects/Transitions registry: type definitions (not GL shaders)

Use case

Building a cloud video editor with an Effect Platform server + Expo app (web + iOS + Android). OpenVideo handles web rendering today. For native, we have to rebuild timeline logic, history, events, and clip management from scratch, the only thing we can reuse is project.json.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions