typegpu

Installation
SKILL.md

TypeGPU / WebGPU for FrameVideo

FrameVideo supports TypeGPU and raw WebGPU through its typegpu runtime adapter. The adapter does not own your pipeline. It publishes FrameVideo time and dispatches a seek event so your composition can render the exact GPU frame.

Contract

  • Initialize WebGPU asynchronously (await navigator.gpu.requestAdapter()), but register all GSAP tweens synchronously — before any await. The FrameVideo player reads the timeline immediately at page load.
  • Render from FrameVideo time, not performance.now().
  • Listen for the fv-seek event and re-render at exactly that time.
  • Guard against environments where WebGPU is unavailable — the adapter does not check for you.
  • For video renders, call await device.queue.onSubmittedWorkDone() after submitting GPU work to ensure the canvas is flushed before the frame is captured.

The adapter sets window.__fvTypegpuTime and dispatches new CustomEvent("fv-seek", { detail: { time } }) on each seek.

Basic Pattern

Installs
43
First Seen
Jun 10, 2026
typegpu — chanjing-ai/framevideo