JSON Diff Developer
Compare two JSON documents by structure rather than by line, so formatting never shows up as a change.
JSON Diff is a free online tool that compare two JSON documents by structure rather than by line, so formatting never shows up as a change. It runs entirely in your web browser using plain JavaScript, so files are processed on your own device and never uploaded to a server. There is no sign-up, no file size limit imposed by the site, no watermark and no paid tier.
- Price
- Free — no account, no quota, no watermark
- Category
- Developer
- Where it runs
- In your browser, on your device
- Files uploaded
- None
- Technology
- plain JavaScript
- Settings
- 2
- Works offline
- Yes, after the first visit
About JSON Diff
A line-based diff on JSON reports reformatting as change. Reorder two keys, switch from two-space to four-space indentation, or let a serializer sort its output, and a text diff lights up while the data is identical. This walks both documents structurally instead, so what you get back is a list of paths — `user.address.city`, `items[3].price` — and nothing else. Key order and whitespace are ignored, because in JSON neither carries meaning.
How to use it
- Paste the text you want to run through json diff.
- Set compare against and also list unchanged keys.
The 2 settings
| Setting | What it does | Default |
|---|---|---|
| Compare against | Free text. | {
"name": "Ada",
"role": "editor",
"tags": ["a", "b", "c"],
"meta": { "active": true, "seats": 3 }
} |
| Also list unchanged keys | On or off. Off by default. | Off |
Under the hood
| Runs on | plain JavaScript — runs the whole thing |
| Controls | Compare against, Also list unchanged keys |
Questions
Does key order matter?
Not to this tool, and not to the JSON specification — an object is an unordered collection. `{"a":1,"b":2}` and `{"b":2,"a":1}` compare as identical here. Array order does matter, because an array is ordered by definition.
How are arrays compared?
By position. Element 0 against element 0, and so on, with anything beyond the shorter array reported as added or removed. That means inserting an item at the start shows every later position as changed — correct, but noisy. Compare by id instead if your arrays are really keyed collections.
What does the ~ mean?
A path present in both documents whose value differs. `+` is only in the second, `-` is only in the first. The type is shown too when it changed, since a string "5" becoming the number 5 is a common and easily missed API break.