docs: 阶段0 技术验证(选型/架构/原型与验证记录)

This commit is contained in:
Muse
2026-11-13 21:19:23 +08:00
commit cbd7ce4b44
25 changed files with 5856 additions and 0 deletions

View File

@@ -0,0 +1,62 @@
# 阶段 0 · 技术验证报告(实测记录)
> 验证时间:2026-11-13 · 环境:Linux 沙箱 Node v24.22.1(前端层验证);Windows/WebView2/真实输入法为人工验证项,见 §4。
> 原型位置:`prototype/`(Vite + React 18 + TS + Milkdown 7.23.0),UI 与测试共用 `src/editor.ts` 同一编辑器工厂。
## 1. 构建与自动化测试结果
| 项 | 命令 | 结果 |
|---|---|---|
| 依赖安装 | `npm install` | ✅(vite 降至 5.4.11 以匹配 @vitejs/plugin-react 4.3.3 的 peer 范围,已在 package.json 锁定) |
| 类型检查 | `npx tsc -b` | ✅ 0 错误 |
| 自动化测试 | `npx vitest run` | ✅ **6/6 通过**(2 文件,约 2.5s) |
| 生产构建 | `npm run build` | ✅ 产物 JS 623KB / gzip 194KB(未分包,阶段 6 做代码分割) |
## 2. 自动化用例明细(tests/)
**roundtrip.test.ts(双向转换,核心验收)**
1. ✅ 基础结构:H1/H2、粗体、斜体标记、删除线、行内代码、引用(含多段)、无序/有序/嵌套列表、分割线、链接 —— 内容保真,且第二轮往返与第一轮逐字一致。
2. ✅ 复杂结构:任务列表 `[ ]`/`[x]` 双状态、GFM 表格(含对齐列)、TypeScript 代码块语言与原文、图片相对路径、H6、Mermaid 代码块源码 —— 同上。
3. ✅ 纯中文无格式段落往返稳定。
**editing.test.ts(编辑行为)**
4. ✅ 撤销/重做:程序化插入 → Ctrl+Z 等价命令恢复原文 → 重做再次应用。
5. ✅ 选区合法性:插入后选区落在文档模型合法区间,文档可继续序列化。
6. ✅ 编辑器 DOM 为真实 `contenteditable`(ProseMirror),非 textarea、非静态 HTML。
**一次性探针(已跑,结论登记,不留常驻用例)**
- 脚注 `[^1]`:定义与引用完整往返 ✅(超出官方预设宣传范围,阶段 3 转正前复测)
- 行内 HTML `<u>` 与块级 HTML `<div>`:原文保留 ✅
- 引用内嵌列表、三级嵌套列表:结构保留 ✅
- 性能探针:158KB 文档 jsdom 全量加载 ≈3.6s、序列化 ≈0.27s —— jsdom 无布局引擎、显著慢于 WebView2,仅作悲观下界;产品指标阶段 6 在真机重测(需求 §20)。
## 3. 验证中发现并已处理的问题
1. **序列化符号规范化**:Milkdown 默认无序列表符号为 `*`,已设 `remarkStringifyOptionsCtx: { bullet: '-' }` 对齐 Typora 习惯;表格对齐冒号仍会规范化(` :--- ` → ` :- `),语义无损、次轮稳定。已登记为选型报告已知限制 1。
2. **React StrictMode 双重挂载**会重复创建 Milkdown 编辑器,原型已移除 StrictMode 并注释原因;正式版在编辑器组件内做幂等挂载处理。
## 4. 必须由大王在 Windows 人工验证的清单(沙箱无法替代)
阶段 0 结论为「有条件通过」,条件即以下四项在原型页面(`npm run dev` 后浏览器打开,或阶段 1 的 Tauri 壳内)人工确认:
- [ ] **中文 IME**:微软拼音连续输入中文长句,组合区不提前上屏、不触发 `#`/列表等自动转换;搜狗拼音同验一轮。
- [ ] **即时渲染手感**:键入 `# `、`- [ ] `、`> `、表格语法,转换即时、无闪烁、光标不跳位。
- [ ] **表格内编辑**:单元格内增删文字、Tab 跳格、末格 Tab 新增行(末格新增行为阶段 3 完整实现,原型先验基础编辑与跳格)。
- [ ] **大段粘贴**:从网页/Word 粘贴富文本,格式映射合理、无整篇重排卡顿。
## 5. 阶段 0 交付物对照(需求 §23)
| 交付 | 状态 |
|---|---|
| 技术验证 Demo | ✅ `prototype/`,可 `npm run dev` 运行 |
| 技术选型报告 | ✅ `docs/01-tech-selection.md` |
| 核心交互原型 | ✅ 原型含标题栏/菜单/侧边大纲/编辑区/序列化侧栏/状态栏 + `docs/04-ui-prototype.md` |
| 项目架构设计文档 | ✅ `docs/02-architecture.md` |
| 核心编辑体验实际操作测试 | ⚠️ 自动化部分全绿;真机手感部分待 §4 人工清单(需大王 Windows 环境) |
## 6. 未完成事项与下一阶段
- Tauri 壳、窗口/菜单/标签页正式实现 → 阶段 1(前置:Windows Rust 工具链)。
- 数学/Mermaid/代码高亮渲染、表格浮动工具栏、图片节点 → 阶段 3(原始文本保真已在阶段 0 锁定)。
- 源码模式(CodeMirror 6)与标记显隐装饰 → 阶段 2。
- **下一阶段计划(阶段 1)**:Tauri 2 工程初始化、自定义标题栏、菜单栏骨架(仅真实可用项)、标签页、侧边栏容器、编辑器挂载、状态栏、基础明暗主题;验收:可启动、界面完整、打开/编辑/保存一个 .md 全链路走通。