mirror of
https://github.com/heygen-com/hyperframes.git
synced 2026-09-14 18:01:20 +08:00
Vance Ingalls
5a3fde19d4
## Summary Adds the ability to render HDR video output (H.265 10-bit, BT.2020) from HyperFrames compositions. When the renderer detects HDR source video, it automatically switches to the HDR output pipeline — no flags needed. ## What it does - **Auto-detection** — Probes each video source with `ffprobe`. If any has bt2020/PQ/HLG color metadata, the output switches to H.265 10-bit with correct color tags. SDR-only compositions are unaffected (H.264, bt709). - **HLG pass-through** — Native HLG pixels from FFmpeg extraction are piped directly to the encoder without conversion. This avoids brightness loss from HLG→linear→PQ conversion (which requires an OOTF system gamma we can't reliably apply). - **Encoder HDR support** — Both chunk and streaming encoders accept HDR presets: `libx265`, `yuv420p10le`, BT.2020 color primaries, `hvc1` codec tag (required for Apple playback). - **WebGPU HDR capture (gated)** — A complete WebGPU float16 readback pipeline is implemented and tested but gated behind headed Chrome (headless doesn't expose WebGPU). Ready for future use with WebGPU canvas content. - **HDR utilities** — `detectTransfer()` (PQ vs HLG), `getHdrEncoderColorParams()`, `analyzeCompositionHdr()`. 15 unit tests. ## Key design decisions | Decision | Why | |----------|-----| | No `--hdr` flag | SDR content encoded as HDR causes orange shift in browsers. Auto-detect eliminates this. | | HLG pass-through (not HLG→PQ) | Conversion loses brightness without OOTF. Pass-through matches source exactly. | | `hvc1` codec tag | Apple QuickTime requires `hvc1` (not `hev1`) for HEVC playback. | | 1-hour streaming timeout | HDR capture at ~6fps needs more time than the default 10-minute FFmpeg timeout. | ## Files changed | File | What changed | |------|-------------| | `packages/engine/src/utils/hdr.ts` | **NEW** — HDR detection, transfer types, encoder params (15 tests) | | `packages/engine/src/services/hdrCapture.ts` | **NEW** — WebGPU readback, HLG conversion, PQ encode | | `packages/engine/src/services/streamingEncoder.ts` | HDR presets, raw rgb48le input, color tags | | `packages/engine/src/services/chunkEncoder.ts` | HDR presets, conditional color tags | | `packages/producer/src/services/renderOrchestrator.ts` | Auto-detection loop, HDR pass-through capture path | ## How to test Render a composition with an HDR video source. The output should be H.265 10-bit with HDR metadata visible in `ffprobe` (bt2020, arib-std-b67 or smpte2084). Plays correctly in QuickTime and on HDR displays. ## Stack position **2 of 6** — Stacked on #258 (SDR/HDR normalization). Provides the encoder infrastructure that phases 1-5 build on. 🤖 Generated with [Claude Code](https://claude.com/claude-code)
86 lines
3.2 KiB
JSON
86 lines
3.2 KiB
JSON
{
|
|
"name": "@hyperframes/producer",
|
|
"version": "0.4.6",
|
|
"description": "HTML-to-video rendering engine using Chrome's BeginFrame API",
|
|
"repository": {
|
|
"type": "git",
|
|
"url": "https://github.com/heygen-com/hyperframes",
|
|
"directory": "packages/producer"
|
|
},
|
|
"files": [
|
|
"dist/"
|
|
],
|
|
"type": "module",
|
|
"main": "dist/index.js",
|
|
"types": "dist/index.d.ts",
|
|
"exports": {
|
|
".": {
|
|
"import": "./dist/index.js",
|
|
"types": "./dist/index.d.ts"
|
|
},
|
|
"./server": {
|
|
"import": "./dist/public-server.js"
|
|
}
|
|
},
|
|
"publishConfig": {
|
|
"access": "public",
|
|
"registry": "https://registry.npmjs.org/"
|
|
},
|
|
"scripts": {
|
|
"build": "bun run build:fonts && bun run --cwd ../.. build:hyperframes-runtime:modular && node build.mjs",
|
|
"build:fonts": "tsx scripts/generate-font-data.ts",
|
|
"typecheck": "tsc --noEmit",
|
|
"parity:check": "tsx src/parity-harness.ts",
|
|
"parity:fixtures": "tsx src/parity-fixtures.ts",
|
|
"parity:fixtures:ci": "tsx src/parity-fixtures.ts",
|
|
"parity:check:ci": "tsx src/parity-harness.ts --preview-url \"http://127.0.0.1:4173/minimal-wysiwyg.html\" --producer-url \"http://127.0.0.1:4173/minimal-wysiwyg.html?mode=producer\" --checkpoints \"0,0.5,1,1.5\" --allow-mismatch-ratio 0 --emulate-producer-swap true --artifacts-dir \".debug/parity-harness-ci\"",
|
|
"perf:gate": "tsx src/perf-gate.ts",
|
|
"check:runtime-conformance": "tsx src/runtime-conformance.ts",
|
|
"benchmark": "tsx src/benchmark.ts",
|
|
"test": "tsx src/regression-harness.ts",
|
|
"test:update": "tsx src/regression-harness.ts --update",
|
|
"docker:build:test": "docker build -f ../../Dockerfile.test -t hyperframes-producer:test ../..",
|
|
"docker:test": "docker run --rm --security-opt seccomp=unconfined --shm-size=2g -v ./tests:/app/packages/producer/tests hyperframes-producer:test",
|
|
"docker:test:update": "docker run --rm --security-opt seccomp=unconfined --shm-size=2g -v ./tests:/app/packages/producer/tests hyperframes-producer:test --update",
|
|
"prepublishOnly": "echo skip"
|
|
},
|
|
"dependencies": {
|
|
"@fontsource/archivo-black": "^5.2.8",
|
|
"@fontsource/eb-garamond": "^5.2.7",
|
|
"@fontsource/ibm-plex-mono": "^5.2.7",
|
|
"@fontsource/inter": "^5.2.8",
|
|
"@fontsource/jetbrains-mono": "^5.2.8",
|
|
"@fontsource/league-gothic": "^5.2.8",
|
|
"@fontsource/montserrat": "^5.2.8",
|
|
"@fontsource/nunito": "^5.2.7",
|
|
"@fontsource/oswald": "^5.2.8",
|
|
"@fontsource/outfit": "^5.2.8",
|
|
"@fontsource/space-mono": "^5.2.9",
|
|
"@hono/node-server": "^1.13.0",
|
|
"@hyperframes/core": "workspace:^",
|
|
"@hyperframes/engine": "workspace:^",
|
|
"hono": "^4.6.0",
|
|
"linkedom": "^0.18.12",
|
|
"postcss": "^8.4.0",
|
|
"puppeteer": "^24.0.0",
|
|
"puppeteer-core": "^24.39.1"
|
|
},
|
|
"devDependencies": {
|
|
"@fontsource/lato": "^5.2.7",
|
|
"@fontsource/noto-sans-jp": "^5.2.9",
|
|
"@fontsource/open-sans": "^5.2.7",
|
|
"@fontsource/playfair-display": "^5.2.8",
|
|
"@fontsource/poppins": "^5.2.7",
|
|
"@fontsource/roboto": "^5.2.10",
|
|
"@fontsource/source-code-pro": "^5.2.7",
|
|
"@types/node": "^22.10.1",
|
|
"@webgpu/types": "^0.1.69",
|
|
"esbuild": "^0.27.2",
|
|
"tsx": "^4.7.0",
|
|
"typescript": "^5.7.2"
|
|
},
|
|
"engines": {
|
|
"node": ">=22"
|
|
}
|
|
}
|