render

Render a composition to MP4 locally using a headless browser and FFmpeg.

Renders a composition file locally using a headless Chrome instance and FFmpeg.

bash
npx editframe render

By default this renders index.html in the current directory to output.mp4.

Basic usage

bash
# Render index.html to output.mp4
npx editframe render -o output.mp4

# Specify a different input file
npx editframe render path/to/composition.html -o output.mp4

# Render from a URL
npx editframe render --url https://mysite.com/composition -o output.mp4

# Pass custom data to the composition
npx editframe render --data '{"title":"My Video"}' -o output.mp4

Flags

14 of 14

How it works

  1. Launches headless Chrome and loads your composition HTML.
  2. Steps through time at the specified fps, capturing each frame.
  3. Pipes frames to FFmpeg, which encodes the final file.
Note: FFmpeg must be installed and available on your PATH. Install it from ffmpeg.org or via your package manager (brew install ffmpeg, apt install ffmpeg).

Examples

bash
# 60fps render
npx editframe render -o output.mp4 --fps 60

# HiDPI (2x) render
npx editframe render -o output.mp4 --scale 2

# Render only the first 5 seconds
npx editframe render -o output.mp4 --to-ms 5000

# Render seconds 2–7
npx editframe render -o output.mp4 --from-ms 2000 --to-ms 7000

# Pass JSON data to a data-driven composition
npx editframe render -o output.mp4 --data '{"name":"Alice","score":42}'