Three.js for FrameVideo

FrameVideo supports Three.js through its three runtime adapter. The adapter does not own your scene. It publishes FrameVideo time and dispatches a seek event so your composition can render the exact frame.

Contract

• Create the scene, camera, renderer, materials, and assets synchronously when possible.
• Render from FrameVideo time, not wall-clock time.
• Listen for the fv-seek event and render exactly that time.
• Load models, textures, and HDRIs before render-critical seeking. Do not fetch them at seek time.
• Avoid requestAnimationFrame or renderer.setAnimationLoop as the source of truth for render-critical motion.

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

Basic Pattern