@hyperframes/producer

Render a HyperFrames project from Node.js.

@hyperframes/producer owns the complete render pipeline: compile the project, capture its frames, encode the video, and mix its audio.

Use it when rendering is part of your own Node.js service or job runner. For a local script or terminal workflow, use npx hyperframes render instead.

npm install @hyperframes/producer

Render one project

createRenderJob() describes the render. executeRenderJob() receives that job, the project directory, and the output path.

import {
  createRenderJob,
  executeRenderJob,
} from "@hyperframes/producer";

const job = createRenderJob({
  fps: 30,
  quality: "standard",
  format: "mp4",
});

await executeRenderJob(
  job,
  "./my-hyperframes-project",
  "./renders/video.mp4",
  (currentJob, message) => {
    console.log(
      `${Math.round(currentJob.progress)}% ${message}`,
    );
  },
);

The entry file defaults to index.html. Set entryFile when the project has a different entry composition.

const job = createRenderJob({
  fps: { num: 30000, den: 1001 },
  quality: "high",
  entryFile: "compositions/launch.html",
});

Choose an output

Format	Best for	Audio
mp4	Default delivery and web playback	AAC
webm	Transparent video for the web	Opus
mov	Transparent ProRes 4444 for an editor	AAC
gif	Small silent previews	None
png-sequence	Lossless frames for another pipeline	AAC sidecar when needed

HDR output is available for MP4 through hdrMode. Transparent formats render in SDR because HDR and alpha are not one supported output path.

const job = createRenderJob({
  fps: 30,
  quality: "high",
  format: "mp4",
  hdrMode: "auto",
});

See HDR rendering for the source and delivery constraints.

Cancel a render

Pass an abort signal to the final argument:

const controller = new AbortController();

await executeRenderJob(
  job,
  "./my-hyperframes-project",
  "./renders/video.mp4",
  undefined,
  controller.signal,
);

// Call controller.abort() from your cancellation path.

An aborted render throws RenderCancelledError. Correctness warnings can also block a render when strictness: "strict" is enabled.

Build a render service

The package exports a Hono application and server helpers:

import { startServer } from "@hyperframes/producer";

await startServer({ port: 8080 });

For larger workloads, the @hyperframes/producer/distributed entry exposes the three rendering activities—plan, renderChunk, and assemble. Your orchestrator remains responsible for dispatch, retries, storage, and networking.

Choose rendering infrastructure

Decide between local, server, Temporal, AWS, or another adapter.

@hyperframes/engine

Use the lower-level capture and encoding primitives.