feat(viewer,ui04): E03 continuous scroll engine — pure state machine, rAF orchestration, boundary continuity

- stream.ts: advanceStream (per-frame, dt cap 50ms), loop generation keys, window math (DOM<=16, queue<=30, 480px buffer), anchorRebuild (photo-position preserving), removePhoto, single-photo static
- useVerticalPhotoStream: rAF integration, direct transform writes (no per-frame Vue reactivity), low-frequency item sync, ResizeObserver re-anchor, stepForTest hook
- EmbedStream wired to engine; cycle copies aria-hidden; img error -> controlled drop
- tests: 14 unit cases (236 viewer total), e2e: 32px/2s speed, boundary continuity <2.5px, DOM<=16 over 20s, 32s recording with loop boundaries

Co-Authored-By: Claude Code <noreply@anthropic.com>
This commit is contained in:
浅念
2026-09-22 13:19:21 +08:00
parent 1d1979f540
commit 998565e439
7 changed files with 914 additions and 23 deletions
+20 -1
View File
@@ -62,7 +62,7 @@
embed.service(cn 管理与 ov 投影共用归一化)、embed-loader params+loader-v2+build/sync、
viewer EmbedPage v=2 分支+EmbedStream+stream.ts+i18n、admin 类型+utils+snippet v1/v2 版本选择)
- [x] E02 静态高保真样板(登记见下)
- [ ] E03 连续滚动
- [x] E03 连续滚动(登记见下)
- [ ] E04 操作和生命周期
- [ ] E05 实时气泡
- [ ] E06 管理预览与接入
@@ -85,6 +85,25 @@
最小修复 eslint.config.mjs globals 补 readonly)。
- E02 出口确认:无标题/底栏/页码/左右按钮,图片窗口形态与目标图一致(截图对照)。
### E03 登记(2026-09-22)
- 引擎架构:纯状态机 stream.ts(advanceStream 单帧推进/advanceStreamFor 分块/
anchorRebuild 锚定重建/removePhoto 移除;窗口数学、循环代次 key、DOM 上限 16/
队列上限 30/缓冲 480px 常量)+ 编排 useVerticalPhotoStream.ts(rAF 积分、transform
逐帧直写 DOM 不经响应式、退役/补尾低频同步渲染列表、ResizeObserver 重测锚定、
单张静态不 rAF、恢复重置 lastTime 不补跑;stepForTest 受控时间测试接口)。
- 单测:embed-stream.spec.ts 14 用例(比例防御/窗口覆盖与副本 key/匀速积分与 dt
封顶/退役边界与多帧跨界/锚定保位/新图入未显示区/锚移除回退/removePhoto 保位/
装配推进 transform/单张静态/dropPhoto 清理)——全仓 viewer 236 绿。
- 动态 e2e(embed-v2.spec.ts E03 块):①16px/s 实测 2s 位移 32px(30-34 断言过);
②12s 逐 250ms 采样跨退役边界:匹配照片连续性 -4px/250ms、最大误差 <2.5px;
③20s DOM 实例恒 ≤16;④32s 录屏 recordings/e03-scroll-32s.webm(含 ≥4 个循环
边界,7.7s/条退役节奏)。
- 修复记录:anchorInPhoto 方向(-acc);transform 写入 0.01px 取整(浮点噪声不进
DOM);单张照片窗口副本刷屏违 §3.2.8 → rebuildItems 单张特判恒一实例。
- E03 出口确认:不瞬移(边界连续性断言)、不露空白(匹配采样全程有内容)、
DOM 不无限增长(上限断言)。
## 4 测量与证据索引
(E02+ 起登记:尺寸实测、位移曲线、DOM/连接上限统计、录屏清单。)