diff
在图形编辑器中，diff 是指两个不同版本的图形状态之间的差异。通过生成这些差异，可以记录编辑器中的操作、追踪修改的历史，或者将这些差异应用到其他地方（例如实时协作中的同步更新）。具体来说，diff 是对比旧版本和新版本的数据结构，提取出两者之间的变化，如添加、删除、修改等。
diff的生成方式
生成 diff 的方式取决于数据结构的类型和复杂度。常见的方式包括：
- 对象浅比较和深比较：
- 浅比较：只对比对象的第一层属性变化，如果属性值发生变化（如对象引用变化），就认为有修改。这种方式简单，但无法检测嵌套对象的深层变化。
- 深比较：递归地对比每一层的属性和值，能够检测到嵌套结构中的变化。深比较更准确，但计算成本较高。
- 操作记录（Command Pattern）：
- 使用命令模式记录每一步操作。例如，用户移动了一个形状、改变了颜色，编辑器将这些操作序列化为一组命令。生成 diff 时，直接比较操作记录即可。
- 这种方法的优点是明确记录每一个操作，容易撤销和重做。
- 基于路径的结构化对比：
- 对于复杂图形结构，可以将图形或节点表示为树或图结构，并通过路径定位具体的变化。例如，用户改变了图形树中的某个节点，那么可以通过节点的路径找到具体的变更部分。
- 这种方式适合结构化的图形数据，如分层图形、场景中的对象层级关系等。
- 快照对比：
- 保存图形编辑器的每一个状态快照（snapshot），然后对比旧快照和新快照来生成 diff。对比时，可以使用哈希或者逐项检查变化。
- 优点是实现简单，适合较小的图形数据；缺点是如果数据量大，存储和对比的性能开销较大。
- 文本差异算法（如diff算法）：
- 适用于基于文本的图形描述（如SVG、JSON等），可以将图形的状态序列化为文本格式，然后使用文本差异算法（如经典的
diff算法）来比较两个版本。 - 这种方式在处理复杂的文本格式（如JSON）时，效率较高，但对处理富图形数据的适应性有限。
实际应用中的diff生成流程
- 编辑器检测到图形数据的变化。
- 根据某种diff策略，对比旧状态和新状态，生成差异。
- 记录或应用差异，如：
- 记录在操作历史中以供撤销/重做。
- 通过网络同步这些差异，支持多人协作。
- 更新UI，展示最终的效果。
这种差异生成和管理机制，能让图形编辑器在性能、协作、历史管理等方面都表现更好。