HyperFrames
HyperFrames 架构：从合成时间到被捕获的画面
梳理文档中的 core、engine 与 producer 分工，再检查动画适配器和 GPU 完成等待，不虚构端到端运行跟踪。
你将学会
- 片段排期、动画状态和捕获就绪是不同边界。
- 动画适配器负责协调具体库与显式时间。
- 资源变化后，相同时间可能需要再次渲染。
开始前需要
- 具备基础 HTML、CSS 与 JavaScript 知识
- 本地练习需要 Node.js 22+ 和 FFmpeg
解释本章对应边界，使用清单评估可重复的视频工作流。
先看结论
- 片段排期、动画状态和捕获就绪是不同边界。
- 动画适配器负责协调具体库与显式时间。
- 资源变化后，相同时间可能需要再次渲染。
跟踪时间穿过不同层次
包目录把解析、运行时和帧适配器归入 core，把基于 Puppeteer 与 FFmpeg 的页面捕获归入 engine，把捕获、编码和混音的完整流程归入 producer。这是文档描述的职责划分，并不意味着每条渲染路径都会执行相同内部调用。
合成边界决定指定时刻应出现哪些片段；动画边界要求适配器把库调整到对应状态；捕获边界则要求记录图像前状态已经就绪。分开这些边界，有助于解释为什么时间戳正确，捕获的画面仍可能不完整。
适配器协调库时钟与请求时间
核对的 GSAP 适配器会取得时间线并暂停，把输入转为数字、使用零兜底并避免负时间。有 totalTime 时，先执行一个抑制事件的小幅调整，再设置精确时间；否则使用 seek。这是针对具体库的渲染处理，不是捕获前简单等待一下。
核对的 Three.js 适配器会将时间写入 window.__hfThreeTime，再派发 hf-seek。它还检查兼容的加载管理器结构，在观察到的资源未完成时暴露就绪 Promise。这一源码观察不能证明所有第三方加载器或自定义 GPU 任务都会自动参与。
就绪状态与时钟位置是不同约定
共享派发器允许同步事件监听器通过 detail.waitUntil 注册 Promise。waitForSeekCompletion 会等待已注册工作，并传播保留的拒绝原因。若合成启动异步 GPU 工作，应在事件回调内注册；之后才发现 Promise 并不符合相同约定。
派发器也提供同一时间点的强制事件。源码注释解释了一个用途：首次 GPU 渲染后才注入视频帧，纹理需要在相同时间再次渲染。因此相同时间戳不一定代表相同资源状态。本章检查的是适配器契约，而不是全部引擎阶段。
实施步骤
- 1
从 README 确认 core、engine 和 producer 分工。
- 2
阅读固定版本中的 GSAP 与 Three.js 定位实现。
- 3
跟踪 hf-seek 注册到完成等待。
- 4
区分已检查的适配器与尚未检查的引擎内部。
可复制示例
合成排期
-> 请求动画状态
-> 库适配器 / hf-seek
-> 已注册的就绪工作
-> 帧捕获
-> 编码与音频流程
文档分层与已检查的适配契约，不是实测运行跟踪。常见问题
设置正确时间就能捕获 GPU 场景吗？
不一定。素材或异步 GPU 工作可能仍未完成，所检查的派发器提供了单独的完成等待机制。
本章分析了整个渲染器吗？
没有。本章结合文档中的包划分，直接阅读三个适配器文件，并明确限定观察范围。
资料来源
- 固定版本 README来源核查 2026-09-07
- GSAP 适配器来源核查 2026-09-07
- 定位事件派发器来源核查 2026-09-07
- Three.js 适配器来源核查 2026-09-07
- GSAP 测试来源核查 2026-09-07
- 派发器测试来源核查 2026-09-07