JSON 对比（Diff）
JSON 对比（Diff）工具，把两份 JSON 分别粘到左右输入框，自动做语义级递归对齐，新增、删除、修改分三色并排高亮，每个差异块的路径都标出来。对象按键名对齐（书写顺序不同不算差异），数组采用 LCS 最长公共子序列对齐，并能识别带 id 字段的元素移动；可以勾选忽略数组顺序、key 按字典序显示。计算在浏览器本地的 Web Worker 中完成，数据不经过服务器。
怎么使用
- 1
粘贴左右两份 JSON
将原始 JSON 粘贴到左侧、待对比 JSON 粘贴到右侧，也可以点击「填入示例」快速体验；任一侧语法错误都会在对应编辑器行内高亮。
- 2
选择对比选项
默认对象忽略 key 书写顺序、数组按位置对齐；对比接口返回的无序列表时可勾选「忽略数组顺序」，需要稳定输出时可勾选「key 按字典序显示」。
- 3
查看三色差异
输入停顿后自动对比：绿色为新增、红色为删除、黄色为修改，左右两列严格等高对齐，null 侧留空占位，移动元素按身份跨位配对。
- 4
用差异导航快速定位
右侧导航栏列出全部差异块及其 JSON 路径（如 $.server.port），点击即可跳转到对应位置；勾选「只看差异」可隐藏大段相同内容。
功能特点
语义对齐而非文本对比
先解析为 JSON 再按键名递归对齐，缩进、空白、key 书写顺序的不同不会制造噪声差异，结果只反映真实的数据变化。
数组 LCS + id 移动识别
数组元素按最长公共子序列对齐；元素对象带有 id 或 _id 字段时，即使交换了位置也能识别为「同一个元素」并只高亮其内部变化。
增删改三色并排高亮
新增绿色、删除红色、修改黄色，左右双栏行对行等高展示，悬停任意一行可查看该节点的 JSON 路径。
差异块导航 minimap
自动把连续变化聚合成差异块，侧栏按路径列出，点击跳转、滚动联动，长 JSON 也能快速审完每一处变化。
敏感数据可用
接口报文、配置这类内容可以直接粘贴对比。
常见错误与排查
- ! 对比前不必手动格式化：工具会先解析再统一渲染，缩进与 key 顺序默认不影响对比结果。
- ! 数组元素的「身份」取自对象的 id 或 _id 字段（字符串或数字）；对比后端返回数据时建议保留这两个字段之一，移动识别更准确。
- ! 只想看内容变化、不关心列表顺序（如批量查询接口）时，勾选「忽略数组顺序」可消除纯重排噪声。
- ! 数组按位置对齐时，中间插入元素会以 LCS 方式展示；同一下标的原始值变化会显示为黄色修改而不是一删一增。
常见问题
JSON 对比会因为 key 顺序不同而报差异吗？
不会。工具先把两侧文本解析为 JSON 数据，再按键名递归对齐对象字段，key 的书写顺序默认忽略。如果你希望输出按统一顺序展示，可以勾选「key 按字典序显示」。
数组顺序不同会怎么显示？
默认按位置做 LCS 对齐：元素位置变化会如实展示为删除 + 新增；如果元素对象带有 id 或 _id 字段，交换位置会被识别为同一个元素的移动，仅高亮其内部真正变化的字段。勾选「忽略数组顺序」后，纯重排将不再产生任何差异，适合对比无序集合。
对比时我的 JSON 数据会上传吗？
不会。对比算法在浏览器本地运行，没有服务器参与。
为什么不用普通的文本 Diff？
文本 Diff 按字符和行比较，key 重排、缩进变化、单行写法不同都会产生大量噪声。语义对比先解析 JSON 再对齐数据节点，只报告真正的新增、删除和值修改，并且能给出每个差异块的 JSON 路径。
支持多大的 JSON？
常规接口响应与配置文件可即时完成。对齐视图对单次渲染行数设置了上限（2 万行）以保证页面流畅；超大文件的虚拟滚动对比将在后续大文件版本中支持，目前可勾选「只看差异」减少渲染内容。