04 · PROTO/PRD diff 面板

PrdDiffPanel · 文档版本差异

展示「本轮反馈引入了什么」。section 级粒度的 diff(不做行级),符合「PRD 修改即增删 section」的写入约束。

线框

PrdDiffPanel · rev 3 vs rev 2
PRD · 项目 p-731042 rev 3 vs rev 2 all + added ~ changed – removed 由 yibo@2026-05-13 10:31 触发 + Section data-rev="3" OAuth 登录 支持 GitHub OAuth。Token 自动刷新 ≤ 5s。 → 影响 Unit:oauth-be · oauth-fe · auth-mw(新增) ~ Section data-rev="1" 修改(来自 rev 3 的影响) 登录 原:邮箱密码登录 → 新:邮箱密码登录 + OAuth 备选 → 影响 Unit:auth-be(contract 不变, hash 不变, 不 reset) Section data-rev="2"(未变) 个人主页 → 影响 Unit:profile-be · profile-fe(未变) Changelog rev 1 · init · 邮箱密码登录 rev 2 · yibo · + 个人主页 rev 3 · yibo · + GitHub OAuth open full PRD ↗

三色 diff 标记

类型颜色判定影响 Unit
addedemerald新 section data-rev 等于当前 rev可能新增多个 Unit
changedambersection data-rev 旧但被新需求隐含修改需要 Architect 标注 + 影响 contract_hash 时才 reset
removedred新 PRD 不再包含的 section(罕见)对应 Unit 整体归档到 history/removed/
unchanged灰底正文不变不动

怎么实现 diff

客户端用 diff-dom,section 粒度。算法:

  1. 对 newHtml 和 oldHtml 分别用 DOMParser.parseFromString
  2. 枚举每个 section[data-rev] 在双方的存在性 + textContent hash
  3. 三态分类:only-new = added · only-old = removed · 同 id 不同 hash = changed
  4. 渲染时为每条 section 包一层 wrapper 标记色

选 section 级而非 token 级,是为了贴合 PM Agent 的写入约束 — 它的修改本来就是 section 粒度。

切 rev 控件

顶部默认 "rev N vs rev N-1",可下拉切换:

  • "rev 3 vs rev 0" — 看从 init 到现在的累积
  • "rev 3 vs rev 2" — 默认
  • "rev 3 only" — 单看本 rev 新增

影响 Unit 提示

每个 diff section 下方一行 → 影响 Unit: ...。来源:

unitRegistry.diffWithSDD(pid)
// → { added: ['oauth-be','oauth-fe'], changed: [], removed: [] }

把 added/changed/removed 列表渲染在对应 diff 行下面,让人类一眼知道「这个反馈引发了哪几个 Unit 入队」。