JSON Diff

The JSON Diff tool compares two JSON objects or arrays and highlights exactly what is different: properties that were added, properties that were removed, and properties whose values changed. Works on any depth of nesting (objects within objects within arrays within objects) and handles both key-level changes and value-level changes. Results are shown in a clear side-by-side view with color-coded highlighting (green for additions, red for deletions, yellow for modifications) plus a structured change list in JSON Patch format (RFC 6902) that you can apply programmatically.

Comparing JSON is essential in several workflows: API contract testing (did the response shape change?), config file reviews (what changed between versions?), snapshot testing (Jest, Vitest snapshot diffing), debugging API regressions (staging response vs production), and data migration verification (before and after an ETL run). This tool runs entirely in your browser, so you can safely compare JSON containing sensitive data — API responses with tokens, customer data, internal configs — without uploading anything. Supports order-sensitive and order-insensitive array comparison, optional ignore lists (skip volatile fields like timestamps), and can generate minimal JSON Patch documents.

JSON diff is more nuanced than text diff. Two JSON strings can differ in whitespace but represent the same data (semantically equal), or differ in property order but have identical content. A proper JSON diff compares structure, not text.

Diff algorithms:

1. Naive object diff — recursively compare every key and value. Simple but fails on arrays (is item at index 2 moved, or replaced?).
2. JSON Patch (RFC 6902) — produces a sequence of operations (add, remove, replace, move, copy, test) that transform one JSON into another. Standard, machine-applicable format.
3. Myers-style diff — used for arrays, identifies longest common subsequence. Handles reordering and insertions.

Change types:

- Added: property exists in the second JSON but not the first.
- Removed: property exists in the first but not the second.
- Modified: property exists in both but values differ.
- Unchanged: property exists in both with the same value (usually hidden in diff view).

Array comparison modes:

- Order-sensitive: [1, 2, 3] and [1, 3, 2] are different (2 and 3 changed).
- Order-insensitive: [1, 2, 3] and [1, 3, 2] are the same (as a set).
- Default is order-sensitive (array order usually matters).

Nested object handling:

Objects within objects are recursed. The diff shows the deepest level where values differ, giving you a precise location (via JSON Pointer, RFC 6901) like /user/address/street.

Type handling:

{ "count": 5 } vs { "count": "5" } — number vs string. The diff treats these as different (type matters). Value equality uses JavaScript strict equality with type coercion disabled.

Volatile field ignoring:

Use-case: API responses include timestamp, request_id, session_id that change every request but do not indicate a real difference. Tool allows an ignore list (JSON Pointer paths to exclude from diff).

JSON Patch output example:

First:
``json
{ "name": "Alice", "age": 30 }
``

Second:
``json
{ "name": "Alice", "age": 31, "city": "NYC" }
``

JSON Patch:
``json
[
{ "op": "replace", "path": "/age", "value": 31 },
{ "op": "add", "path": "/city", "value": "NYC" }
]
``

Performance:

Structural diff is O(n) where n is the number of properties. Very large JSON (1 MB+) may be slow to diff visually but fast to diff programmatically. For performance-critical comparison, use a hash-based diff (compute SHA-256 of each subtree, diff hashes).

JSON Diff vs Text Diff: Text diff compares strings character-by-character. JSON diff compares structure — semantic equality ignoring whitespace and property order. Use text diff for source code; JSON diff for data.

JSON Patch (RFC 6902) vs JSON Merge Patch (RFC 7396): JSON Patch produces minimal operations (add, remove, replace). JSON Merge Patch produces a document showing the merged result. Use Patch for efficient incremental updates; Merge Patch for simpler state updates.

Semantic vs Syntactic diff: Semantic diff ignores whitespace, property order, and cosmetic differences — focuses on data equality. Syntactic diff cares about text. This tool is semantic by default.

Visual diff vs API Patch: Visual diff for human review. JSON Patch for programmatic application (transform JSON 1 into JSON 2 via API call).

This tool vs command-line diff (jq, diff): CLI tools handle huge files better and integrate into shell pipelines. This tool handles interactive human review with visual feedback. Use both — they complement each other.

JSON Diff vs Git diff: Git diff is line-based and works on any text. JSON Diff understands structure. For JSON in Git, both are useful — git diff for version control, JSON diff for structural changes.