xiaye
671f58507f
Three independent costs in `hyperframes check`, none of which changed what the gate detects: 1. Motion-only grid times took the full audit settle. AUDIT_SEEK_OPTIONS pays an unconditional 120ms paint-flush sleep plus a glyph-subset font wait on every seek, but a time that only feeds collectMotionFrame needs neither — __hyperframesMotionSample reads computed transforms and opacity, which the ordered double-rAF already guarantees are committed. At 20fps the motion grid is up to 300 samples, so this sleep dominated any run carrying an index.motion.json. Times that measure text (layout), photograph the frame (contrast) or read caption/frame geometry keep the full settle. 2. `waitForCompositionSettle` slept a flat 1500ms on every page open, after __renderReady, shader pre-render and document.fonts.ready had all already resolved. Replaced with a poll that holds a 400ms floor, then exits on the first pair of consecutive frames with no font subset in flight, capped at the original 1500ms — worst case unchanged, common case ~1s faster. 3. `collectContrast` always took a second full-page screenshot to build the annotated overview, then the pipeline discarded it unless --snapshots was set. The bare `collectContrast(time)` call shape already meant "no snapshots", so that now skips the shot and its overlay entirely. collectGridSamples' per-time layout and contrast blocks are extracted to keep it under the complexity gate after the seek-profile branch. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
hyperframes
CLI for creating, previewing, and rendering HTML video compositions.
Install
npm install -g hyperframes
Or use directly with npx:
npx hyperframes <command>
Requirements: Node.js >= 22, FFmpeg
Commands
init
Scaffold a new Hyperframes project from a template:
npx hyperframes init my-video
cd my-video
preview
Start the live preview studio in your browser:
npx hyperframes preview
# Studio running at http://localhost:3002
npx hyperframes preview --port 4567
render
Render a composition to MP4. Run from the project directory; the positional
argument is the project directory (not a file), so render the project's
index.html directly, or point at a specific composition file with -c:
npx hyperframes render -o output.mp4
npx hyperframes render -c ./my-composition.html -o output.mp4
lint
Validate your Hyperframes HTML:
npx hyperframes lint ./my-composition
npx hyperframes lint ./my-composition --json # JSON output for CI/tooling
npx hyperframes lint ./my-composition --verbose # Include info-level findings
By default only errors and warnings are shown. Use --verbose to also display informational findings (e.g., external script dependency notices). Use --json for machine-readable output with errorCount, warningCount, infoCount, and a findings array.
compositions
List compositions found in the current project:
npx hyperframes compositions
benchmark
Run rendering benchmarks:
npx hyperframes benchmark ./my-composition.html
doctor
Check your environment for required dependencies (Chrome, FFmpeg, Node.js):
npx hyperframes doctor
browser
Manage the bundled Chrome/Chromium installation:
npx hyperframes browser
info
Print version and environment info:
npx hyperframes info
docs
Open the documentation in your browser:
npx hyperframes docs
upgrade
Check for updates and show upgrade instructions:
npx hyperframes upgrade
npx hyperframes upgrade --check --json # machine-readable for agents
Documentation
Full documentation: hyperframes.heygen.com/packages/cli
Related packages
@hyperframes/core— types, parsers, frame adapters@hyperframes/engine— rendering engine@hyperframes/producer— render pipeline@hyperframes/studio— composition editor UI