toolgarden.xyz
中文

JSON Diff

Free online JSON / JSONC / JSON5 diff tool to visually compare two documents, highlighting additions, removals, and changes

Left JSON (original)

Right JSON (new)

About this tool

JSON Diff parses both documents into data structures and compares them recursively by object key and array index. It focuses on paths and values rather than indentation, line breaks, or object key order, which makes it more useful than plain text diff for API responses and configuration.

The result separates additions, removals, and changed values while retaining the path of every difference. Reordering object keys is ignored, but arrays are ordered, so moving an array item can appear as changes at several indexes.

How to use it

  1. Enter the baseline

    Put the older or expected document on the left. Strict JSON, JSONC, and JSON5 inputs are accepted.

  2. Enter the candidate

    Put the newer document on the right. A diff is created only after both sides parse successfully.

  3. Review changes by path

    Use each path, old value, and new value to trace the change back to the producing API or configuration source.

Input and output example

Differences are reported by field rather than by line. Note that a changed key order is not a difference.

Two documents
// left
{ "name": "kit", "port": 8080, "old": 1 }

// right
{ "port": 3000, "name": "kit", "tls": true }
Differences
~ port   8080 → 3000
- old    1
+ tls    true

Supported range and limits

Comparison granularity
By field and path through the structure, not line by line as text
Changes detected
Added fields, removed fields, changed values, changed types
Arrays
Compared by index, so inserting one item marks everything after it as changed
Key order
Irrelevant. Two documents with the same content in a different key order compare as equal
Accepted input
Strict JSON, JSONC and JSON5, and the two sides need not match
vs Text Diff
Text Diff compares lines and is confused by formatting differences; this looks only at the data

When you would use it

  • Checking an API release

    Compare the same response before and after deployment to catch added fields, type changes, or drifting defaults.

  • Reviewing configuration edits

    Ignore formatting churn and inspect only keys that were added, removed, or assigned a different value.

  • Locating a difference between environments

    Compare the same endpoint's response from two environments field by field to find where configuration or data diverges.

What to know before you start

  • Arrays are compared by index. Inserting one item in the middle shifts later indexes and is not the same as diffing keyed database rows.
  • Number comparison follows JavaScript number precision. Preserve very large identifiers as strings in the source data.
  • Duplicate object keys are overwritten during parsing, so an earlier duplicate cannot appear in the diff.

Related concepts

structural diff
A comparison that parses values first, then walks object members and array indexes instead of comparing text lines.
JSON path
A path notation for a changed location, such as $.user.roles[0] for the first role in a user object.

Frequently asked questions

What differences can the JSON diff detect?
It compares two JSON documents structurally and highlights added, removed and changed fields, so you can quickly spot changes in configs or API responses.
Does it support diffing JSONC / JSON5 with comments?
Yes. It can compare JSONC / JSON5 with comments and trailing commas by parsing them into standard structures first.
Does comparing upload my data?
No. Both JSON documents are parsed and compared locally in your browser, with nothing uploaded.
Why does inserting one array item mark everything after it as changed?
Arrays are compared by index. Insert an item and the old second element becomes the third, shifting every position after it, so all of them register as changed. That is inherent to positional comparison, not a false positive.
Does a different key order count as a difference?
No. Comparison is structural rather than textual, so two documents with the same content in a different key order compare as equal. Text Diff behaves differently and would show that reordering as a large change.

Related tools