69 lines (47 loc) · 3.59 KB

InnoDB B+树可视化项目代码审查与修复交付

本文件汇总本轮审查结论、问题严重性评估、已落地改动、影响模块与验证结果。

📋 项目概览

项目类型：React + TypeScript + D3.js 教育可视化工具
核心流程：data 表数据 -> 构建两棵索引树（PK/Secondary）-> TreeVisualizer 渲染 -> 点击/按钮触发 AI 解释

🔍 审查过程覆盖

代码走查：入口、组件、服务、核心算法、测试
静态分析：类型一致性、边界条件、状态变异、依赖与构建配置
动态验证：单测运行、生产构建、预览回归

🧾 逻辑问题清单（含严重性与状态）

ID	严重性	问题摘要	影响模块	状态
S-01	严重	构建期把 GEMINI_API_KEY 注入前端产物存在泄露风险	vite.config.ts	已修复
B-01	高	DataTable 渲染时原地 sort 变异父 state，破坏插入顺序语义	DataTable.tsx	已修复
B-02	高	删除流程对树做就地变异但随即重建，语义冲突且易产生状态问题	App.tsx	已修复
A-01	高	二级索引重复 key 采用“重复 key 多槽位”会引发跨叶定位/删除一致性风险	bPlusTreeLogic.ts	已修复（改为聚合）
A-02	中	删除后分隔键未同步更新（不下溢时也可能陈旧）	bPlusTreeLogic.ts	已修复
T-01	中	依赖 @ts-ignore 注入 parent，类型系统不完整	types.ts / bPlusTreeLogic.ts	已修复
UX-01	低	使用 alert 阻塞 UI	App.tsx	已修复
V-01	中	叶子链可视化未基于真实 next，可能掩盖算法错误	TreeVisualizer.tsx	已修复
D-01	低	index.html 引用不存在的 index.css 且混用 importmap	index.html	已修复

✅ 已落地改动（按主题）

1) 安全与配置

移除 Vite 构建期注入 process.env.GEMINI_API_KEY 的配置，避免真实 Key 出现在 bundle 中
删除仓库内 .env.local 占位文件，统一为 UI/LocalStorage 配置 Key

2) 业务流程与状态语义

pkTree/secTree 改为由 data 派生计算，删除时只更新 data，消除“删完立刻重建覆盖”的冲突

3) B+树核心逻辑与类型安全

在 BPlusTreeNode 明确加入 parent 字段并在插入/分裂/合并/借用中维护
二级索引重复 key 改为同 key 槽位聚合存储（data[i] 多条记录），避免跨叶重复导致的路由/删除不一致
下溢处理由递归改为迭代，降低极端情况下栈深风险
删除后分隔键提供向上刷新，覆盖“不下溢但最小 key 变化”的场景
节点 id 生成改为实例级计数，避免 SPA 运行时全局计数无限增长

4) 可视化与入口一致性

叶子链路渲染改为基于真实 next 指针
修复 zoom 绑定清理与依赖稳定性
移除无效 importmap 与不存在的 /index.css 引用
修正 README 启动命令与 scripts 一致

5) 交互与提示

新增 Toast 组件，用非阻塞提示替代 alert，并在缺少 API Key 时自动打开设置

🧪 测试与验证

新增 AIService 单测（OpenAI-compatible 分支与 Gemini 分支通过 spy 验证）
新增 B+树“分隔键不变量”测试与“删除叶子首 key 分隔键更新”测试
已通过 vitest run 全量测试与 vite build 生产构建

📌 仍建议的后续优化（不影响当前正确性）

性能：数据量增大时“每次 data 变化都全量重建树”会变慢，可考虑增量更新或批量操作 API
体积：生产构建单 chunk 超 500KB，可按需拆分（D3/AI SDK 代码分割）