What This Tool Does
This tool compares two JSON objects or arrays and highlights the exact differences. It performs a deep recursive diff to find added, removed, and modified keys, even in deeply nested structures.
Inputs Explained
- Original JSON: The base JSON document to compare against.
- Modified JSON: The new JSON document containing changes.
- Output Mode: Choose between Side-by-side, Unified, or Path list view.
- Ignore Key Order: If checked, object properties are compared regardless of their order (which is standard JSON behavior).
How It Works
The tool parses both inputs into JavaScript objects and recursively traverses them. For arrays, it compares elements positionally. For objects, it matches keys. It then categorizes every path as 'added', 'removed', 'changed', or 'unchanged'.
Formula / Logic Used
JSON Diff Tool
Compare two JSON documents and highlight added, removed, or changed properties.
Step-by-Step Example
Original: {"name": "API", "version": 1}
Modified: {"name": "API", "version": 2, "active": true}
Result:
"name": "API"
- "version": 1
+ "version": 2
+ "active": true
Use Cases
- API Debugging: Compare API responses from v1 and v2 endpoints.
- Config Changes: Review changes made to a JSON configuration file before deploying.
- Test Verification: Diff expected JSON output against actual test output.
- Database Records: Compare two NoSQL document snapshots.
- State Management: Diff Redux or React state objects to trace side effects.
Assumptions and Limitations
- Arrays are compared by index. It does not automatically detect inserted elements in the middle of an array without shifting subsequent elements.
- Does not currently support matching array elements by a unique 'id' field.
- Extremely large JSON files (>5MB) may cause browser stuttering during recursive traversal.
- Cannot diff JSON with trailing commas or comments unless they are stripped first (uses standard JSON.parse).
Frequently Asked Questions
How do I ignore certain keys when diffing JSON?
Useful when comparing API responses that include timestamps or generated IDs that change every request. In our JSON Diff Tool, click "Ignore keys" and add the key paths you want to skip — for example, createdAt, updatedAt, requestId. Wildcards work too: *.timestamp ignores any key called timestamp at any depth. Programmatically, libraries like deep-diff (Node) and jsondiff (Python) accept a filter function that returns true for keys to skip. Diffs become much cleaner when you mute the noise — you instantly spot the actual changes instead of scrolling past 50 timestamp differences.
How do I compare two YAML files using a JSON diff approach?
YAML and JSON are structurally compatible, so the cleanest path is: convert both YAML files to JSON (using yq on the command line or js-yaml in Node), then diff the JSON. Our JSON Diff Tool has a "Paste YAML" toggle that does this conversion automatically — paste YAML, see the structured diff. Why this works: comments and formatting differences in YAML are noise; you usually care about the data, not whether someone used 2-space vs 4-space indent. For preserving comments, use a YAML-specific tool like yamldiff. For most config-file comparisons, JSON-based diffing is faster.
How do I show added, removed, and changed keys in a JSON diff?
Our tool colour-codes the output: green for additions (keys in the new file not in the old), red for removals (keys in the old but not the new), and yellow for value changes (same key, different value). You can toggle each colour to focus on one category. The summary panel shows counts: e.g., "+12 added, -3 removed, ~5 changed." For programmatic use, libraries like microdiff return a structured array of {type, path, value} objects you can render or process. Useful in API regression tests where you want to alert only on removed or changed fields.
How do I compare two large JSON files (10MB+) in the browser?
Browsers can struggle with very large JSON because parsing and rendering both fight for memory. Our tool handles up to about 25 MB per file using streaming JSON parsing and virtualised rendering — you only see the diff lines on screen at any moment, not all 10 million. For files larger than that, do the diff offline with jq or a Python script and just review the output. Tip: pre-sort both files' keys before diffing — different key orders look like changes when they aren't. We also have an "Object key sort" option built in for this exact reason.
Why is my JSON diff showing differences in identical files?
Almost always one of three culprits. One: different key order. JSON objects don't have an inherent order, but text-based diffs do — sort both files' keys alphabetically before comparing. Two: trailing whitespace, line endings (CRLF vs LF), or BOM characters at the start of the file. Three: number formatting — 1.0 vs 1, or 1e2 vs 100. Our JSON Diff Tool normalises all of these by default (parsing into objects, then comparing semantically), so it shouldn't false-positive. If you're using a plain text diff like diff on the command line, switch to a structural JSON differ.
How do I export a JSON diff result as a report?
Our tool's "Export" button gives you three formats: plain-text patch (similar to a git diff), HTML with the colour-coded view (great for emailing to a teammate), and machine-readable JSON-Patch (RFC 6902) which describes the changes as add/remove/replace operations. Pick whatever suits your use. For team review, HTML is most readable. For CI pipelines that reject regressions, JSON-Patch lets you assert on specific change types. We also support a "share via link" feature that creates a unique URL containing the diff — handy when reviewing changes with non-developer stakeholders.