工具代码会在浏览器中处理所选文件和输入内容，不会将其提交给 TOOLGRID 的处理接口。 TOOLGRID 只衡量工具使用情况，不记录你输入的内容。
- 不上传工具输入至 TOOLGRID
- 不登录
- 复制前先检查
Loading tool…
这个工具能做什么
In-browser JSON diff tool. Walks both trees recursively, ignores object key order, surfaces type changes, counts each kind.
Paste two JSON values — a Left and a Right. The tool parses both, walks them recursively, and emits a structured diff: lines prefixed with + show keys/values only in the Right, lines prefixed with - show keys/values only in the Left, and unchanged content appears as-is. The output uses indentation to preserve the nested structure so you can see exactly where each change lives.
Unlike a line-based diff (which is what most diff tools do), this is a semantic diff: reordering object keys produces no diff (objects are unordered by spec), and pretty-printing differences are ignored. It compares what the JSON represents, not how it's formatted.
Arrays are diffed positionally by default: index 0 of Left vs index 0 of Right, etc. This matches how Git diffs JSON files — useful for change review on ordered data (history, time-series, sequence-sensitive lists). For semantic array diffing where elements should be matched by content rather than index, post-process with a manual review pass.
Counts of added / removed / changed / unchanged primitives are shown above the output so you can spot a small-but-impactful change in a sea of unchanged data. Tool code processes selected files and entered content in your browser and does not submit them to a TOOLGRID processing endpoint. Pair with JSON Formatter to clean up the inputs first, or Text Diff Checker for line-by-line comparison when the inputs aren't JSON.
这个工具适合解决什么问题
Capture a sample response before and after a backend change. Drop both in and immediately see which fields were added, removed, or changed — far faster than scanning two pretty-printed payloads side by side.
Paste prod's feature-flag JSON on one side and staging's on the other. The structural diff surfaces every divergence without false positives from key-order or formatting differences.
When debugging a state-management bug, capture the state object before and after the suspect action. The diff shows exactly which fields changed — useful for finding unexpected side effects.
依赖结果前需要检查什么
- Performance and maximum practical input size depend on browser memory, device speed, and the structure of the input.
- Review the generated result before replacing or publishing an original file.
如果还需要校验、转换或复用结果，可以继续打开相近的浏览器本地工具。
如何使用
01使用场景
Capture a sample response before and after a backend change. Drop both in and immediately see which fields were added, removed, or changed — far faster than scanning two pretty-printed payloads side by side.
Paste prod's feature-flag JSON on one side and staging's on the other. The structural diff surfaces every divergence without false positives from key-order or formatting differences.
When debugging a state-management bug, capture the state object before and after the suspect action. The diff shows exactly which fields changed — useful for finding unexpected side effects.
Compare the original document against the post-patch result to confirm the patch did what you intended. Especially useful when the patch has many operations.
When migrating between schema versions, run the migration on a sample document and diff against expected output. Faster than writing assertion-by-assertion tests for ad-hoc changes.
使用技巧
- 01Object diff is order-insensitive; array diff is positional
JSON objects are unordered by spec, so <code>{a:1,b:2}</code> equals <code>{b:2,a:1}</code> — no diff. JSON arrays are ordered, so <code>[1,2]</code> ≠ <code>[2,1]</code> — diff. For order-insensitive array comparison (set semantics), this tool isn't the right fit — sort both arrays first and re-diff.
- 02Type changes count as 'changed'
If a value's type changes (e.g., <code>"42"</code> string to <code>42</code> number), it counts as one changed value. The diff line shows both the old and new representations so the type shift is visible.
- 03Counts represent leaf-level changes
Added / removed / changed counts measure primitive (leaf) operations, not whole-subtree changes. If you delete a nested object with 5 keys, you get 5 'removed' counts, not 1. This is the granularity most useful for understanding how impactful the diff is.
- 04Use the JSON Formatter first if inputs look unstructured
If your two inputs are minified or contain extraneous whitespace, paste through the JSON Formatter first. The diff itself ignores formatting, but pretty-printing first makes the diff output easier to read.
常见问题
02Does this run entirely in my browser?
JSON.parse, recursive comparison, and textual diff output run in your browser. Tool code does not submit either JSON input to a TOOLGRID processing endpoint. Review browser extensions and device security before handling sensitive content.
How is this different from the Text Diff Checker?
The Text Diff Checker compares two text blocks line-by-line — useful for diffing code or prose. The JSON Diff Checker parses both inputs as JSON and compares their STRUCTURE: reordered object keys produce no diff, pretty-printing differences are ignored, type changes are surfaced explicitly. Use line diff for code, structural diff for JSON.
Does it support deep arrays of objects?
Yes — the diff recurses into nested arrays and objects without depth limits. Arrays are compared positionally (element 0 vs element 0, etc.). For arrays where you want to match by content (e.g., 'find me the elements unique to each side regardless of position'), this tool is not the right fit — you'd need a tool that supports id-based array diffing.
What if my inputs aren't valid JSON?
The tool surfaces the parse error inline for whichever side failed. Fix the JSON (often a trailing comma, single-quoted string, or unquoted key) and the diff updates live. For pretty-printing and validating, our JSON Formatter is the sibling tool.
How are added/removed/changed counted differently from 'unchanged'?
Each primitive (leaf) value contributes one count: 'added' for keys only on the Right, 'removed' for keys only on the Left, 'changed' for keys present on both with different values, 'unchanged' for keys present on both with identical values. Whole-object additions/removals add up across all their leaf primitives.
Can I diff two JSON arrays at the top level?
Yes. Top-level arrays are diffed positionally — element 0 on Left vs element 0 on Right, etc. If lengths differ, extra elements are shown as additions or removals.
Does the tool work for very large JSON files?
Performance depends on input size and depth. Hundreds of kilobytes are fast; multi-megabyte deep-nested JSON may take a moment. For huge inputs, use a CLI tool like <code>jd</code>, <code>jsondiffpatch</code>, or <code>diff <(jq -S . a.json) <(jq -S . b.json)</code> which can stream and avoid loading both into browser memory.