canvas-ui icon indicating copy to clipboard operation
canvas-ui copied to clipboard

Feat/headless canvas

Open myers opened this issue 2 months ago • 0 comments

Hello! 您好

This builds on my work in https://github.com/alibaba/canvas-ui/pull/34, I suggest you will want to look at the last commit to understand this PR. When that other PRs are merged I will update this PR and remove the draft designation.

This PR adds HeadlessCanvas, a React component for rendering Canvas UI to OffscreenCanvas without mounting to the DOM.

Changes:

  • Add HeadlessCanvas component with event injection API
  • Accept user-provided OffscreenCanvas and custom frameScheduler
  • Provide injectEvent and injectWheelEvent helpers via onReady callback
  • Support onFrameEnd callback for texture copying
  • Export HeadlessCanvas and related types from @canvas-ui/react

Benefits:

  • Enables WebXR layer rendering (XRWebGLLayer texture targets)
  • Manual frame control with custom schedulers
  • Programmatic event injection for XR controllers
  • No DOM coupling for headless environments

Use cases:

  • WebXR UI panels rendered to quad layers
  • Custom render loop integration

myers avatar Oct 13 '25 03:10 myers