Skip to content

JSON Diff Viewer

Compare two JSON documents and see added, removed, changed and unchanged values by path. Key order is ignored; array order is compared by position.

Developer Runs client-side Free to use
Jump to the tool
Share: X WhatsApp
Loading JSON Diff Viewer…

About the JSON Diff Viewer

JSON Diff Viewer compares an original JSON document with an updated one and lists every difference by its path, such as $.user.roles[1]. Each entry is marked Added, Removed, Changed or Unchanged, with the old and new values, and a summary counts each kind of change.

Object keys are matched by name, so simply reordering keys is not reported as a change. Array order is treated as meaningful: items are compared position by position, so inserting an item near the start of an array makes later positions show as changed. Values are displayed strictly as text — any HTML inside your JSON is shown, never rendered.

How to use

  1. Paste the original document into Original JSON and the new version into Updated JSON.
  2. Click Compare. Each document is validated separately, with the line and column of any error.
  3. Read the summary counts, then the list of paths and their old and new values.
  4. Untick “Show unchanged values” to focus only on differences.
  5. Copy or download the text summary; use Swap inputs to reverse the comparison.

Key features

  • Structured, path-based comparison for nested objects and arrays.
  • Key order ignored for objects; array order compared position by position.
  • Added, Removed, Changed and Unchanged entries with a summary count.
  • Type changes (for example a number becoming a string) reported as changes.
  • Safe text-only display of all values.
  • Copy and download a plain-text summary with +, - and ~ markers.

Best practices

  • Sort arrays the same way before comparing if their order does not matter to you.
  • Format both documents first if they come from different tools, so errors are easier to locate.
  • Remember that JSON numbers above 2^53 lose precision when parsed in any browser.
  • Use the downloaded summary in code reviews or change tickets.
  • Don’t paste production secrets or personal data you aren’t allowed to share — even though nothing is uploaded.

Benefits

  • Spot API response or config changes without reading two files line by line.
  • No false alarms from reordered keys.
  • Exact paths make changes easy to find in code.
  • Runs locally in your browser.

Frequently asked questions

Does key order matter?

No. Object keys are matched by name, so {"a":1,"b":2} and {"b":2,"a":1} are reported as equivalent.

Does array order matter?

Yes. Arrays are compared position by position. If an item is inserted at the start, every following position is reported as changed.

What does a path like $.items[2].price mean?

$ is the root of the document, .items is a key, [2] is the third array element and .price is a key inside it.

What if one of my documents is invalid?

Each document is validated separately and the error tells you which one failed and, where the browser provides it, the line and column.

Is HTML in my JSON safe to paste?

Yes. All values are displayed as plain text and are never inserted into the page as HTML.

Is my JSON sent anywhere?

No. The comparison runs entirely in your browser.