Overview
Compare two JSON documents and see what changed
Eyeballing two JSON blobs to spot the difference is slow and error prone, especially once objects nest a few levels deep or arrays get long. A JSON diff does the work for you: it walks both structures key by key and value by value, then reports exactly what was added, removed, or changed.
ToolHub JSON Compare parses your two documents, runs a recursive deep comparison, and lists every difference with a dot-notation path so you can jump straight to the field that moved. It understands nested objects and arrays, and it runs entirely in your browser.
Step-by-step
How to compare two JSON values
- 1
Paste the original JSON on the left
Drop your baseline document into the Left JSON panel. If it is not valid JSON, an inline error tells you what went wrong. - 2
Paste the JSON to compare on the right
Add the second version into the Right JSON panel. Both sides must parse cleanly before the diff appears. - 3
Read the differences
Additions show in green, removals in red, and changed values in amber with the old and new value side by side. Click copy to grab the full diff as text.
Background
How the deep comparison works
The tool parses both inputs with JSON.parse, then recursively compares them. When both sides are objects, it checks every key present in either one. When both sides are arrays, it compares element by element. When it reaches two primitive values that differ, it records a change.
What dot-notation paths mean
Each difference is labelled with the path to the value, like address.city for a nested object key or roles[1] for the second item in an array. This mirrors how you would reach the value in JavaScript, so it is easy to find in your source.
Added, removed, and changed
A key that exists only on the right is Added. A key that exists only on the left is Removed. A key on both sides with a different value is Changed, and the tool shows both the old and new value so you can see the exact edit.
Use cases
When a JSON diff is useful
Reviewing API responses
Compare a response before and after a change to confirm only the fields you expected actually moved.
Debugging config drift
Diff a working config against a broken one to find the single setting that differs.
Verifying migrations
Check that a transformed or migrated record still matches the original shape and values.
Snapshot testing by hand
Paste an expected snapshot next to an actual one to see why a test failed.
Comparing feature flags
Diff two environments' flag payloads to confirm what is enabled where.
Auditing exports
Compare two data exports taken at different times to track what records changed.
Tips and best practices
- Format both documents first so a stray formatting difference does not distract you. The diff compares values, not whitespace, but tidy input is easier to scan.
- Key order does not matter. Two objects with the same keys in a different order count as identical.
- Array order does matter. Reordering items shows up as changes because elements are compared by position.
- If both sides parse but you see no list, the documents are identical and the tool says so.
- Use the copy button to paste the diff into a pull request, ticket, or chat message.
Common questions
Does array order affect the comparison?
Yes. Arrays are compared index by index, so moving an item changes the value at one or more positions. If you need order-independent matching, sort both arrays before pasting them.
Does the order of object keys matter?
No. Objects are compared by key, not by position, so {"a":1,"b":2} and {"b":2,"a":1} are treated as identical.
What happens if my JSON is invalid?
Each side parses independently. If one side is malformed, you get an inline error under that panel and the diff waits until both sides are valid JSON.
Can it handle deeply nested data?
Yes. The comparison recurses through nested objects and arrays at any depth, and the dot-notation path tells you exactly where each difference lives.
100% private