Diagram Design：有证据的视觉解释
Diagram Design 性能与成本：分别测量创作、渲染和修改
设计有用的评估，避免把模板数量、按需加载或十六项功能案例包装成虚构的速度与成本结论。
你将学会
- 先把工作拆成可测量阶段
- 把依赖和返工一起计入
- 设计诚实的基准记录
开始前需要
- 了解 HTML 与 SVG 基础
- 区分系统关系与视觉布局
选择有用的表达方式，说明简化理由，并在实际覆盖范围内解释检查结果。
先看结论
- 分别测量创作、渲染与修改。
- 统计验收通过的产物，并包含返工。
- 功能测试不能证明提速。
先把工作拆成可测量阶段
图解流程包括理解资料、选择表达方式、生成标记、检查、渲染，以及审阅后的修改。文件渲染快不代表创作快，读取较少文档也不必然意味着智能体对话更短。应测量团队实际流程中占主要时间的阶段，而不是只挑容易计时的部分。
按需参考文档有望避免加载无关说明，但本次没有比较 token 消耗。估算收益前，应记录同等任务实际读取了哪些参考、需要几轮修改。使用包含不同关系的固定任务集，而不是不断重复一个简单架构例子来代表所有图解工作。
把依赖和返工一起计入
静态标记无需持续运行图解后端，但交付仍可能涉及字体和导出浏览器。PNG 生成还包括栅格尺寸、浏览器启动及存储；SVG 保留向量，却依赖目标环境的字体行为。这些成本与创作模型用量不同，应分别计入预算。
除了生成耗时，还要记录修复工作。若一张图反复移动标签或纠正语义，其总成本可能远高于首轮耗时。统计应以验收通过的产物为单位，而不是仅统计写出的文件，并记录读者能否不打开原系统说明就回答目标问题。
设计诚实的基准记录
比较不同方法时，固定源关系图、读者、尺寸和验收条件。将冷启动依赖安装与稳定状态导出分开；涉及渲染时记录机器和浏览器版本。失败或被拒绝的产物也要进入统计，而不是从分母里删除，以制造更好的平均结果。
十六项几何案例只证明功能行为。本次没有测量模型费用、浏览器渲染、宿主启动、内存或读者理解程度。下面的记录刻意保留未知值，只有在获准环境中执行可复现实验后，才能把它们替换为真实观察。
实施步骤
- 1
定义有代表性的任务和验收规则。
- 2
记录源内容、输出配置与工具版本。
- 3
区分冷启动安装和重复渲染。
- 4
如实报告未知值与被拒绝结果。
可复制示例
{
"基准状态": "未执行",
"创作Token数": null,
"首次渲染毫秒": null,
"导出毫秒": null,
"修改分钟": null,
"验收产物成本": null,
"读者理解提升": null
}常见问题
按需参考文档证明 token 费用更低吗？
它描述加载策略。实际节省取决于宿主、任务复杂度和修改次数，需要测量比较。
检查器运行时间能代表生成速度吗？
不能。解析模拟矩形与理解资料、智能体创作、浏览器渲染和编辑审阅是不同工作。
资料来源
- README.md来源核查 2026-09-08
- skills/diagram-design/references/output-spec.md来源核查 2026-09-08
- scripts/verify-geometry.py来源核查 2026-09-08