JSON Diff (Compare Two Documents)
Put two JSON documents side by side and see exactly which fields were added, removed or changed, after formatting and sorting away the noise of indentation and key order.
An API revision, a configuration change, a cache that disagrees with the database — the question is always the same: where exactly do these two documents differ? Reading them by eye is a losing game once indentation and key order stop matching. This tool puts both texts side by side, shades the changed lines, and reports the number of changed blocks at the top of the view.
The comparison is computed by the editor component in the browser, and both documents stay in local memory rather than being uploaded, which matters for responses carrying account details, internal pricing or customer identifiers. Either pane can be edited in place, so there is no need to prepare the text in another editor before bringing it here.
How line-level diffing works, and where it stops
The diff aligns the two texts line by line and marks blocks as added, removed or modified; the number at the top counts changed blocks, not changed characters or lines. Two consequences follow. Whitespace is part of the comparison, which is why ignoring blank space and line endings is enabled by default. And a document that has only been reformatted, with key order unchanged, usually produces no blocks at all, while a document whose keys were reordered marks nearly every line as changed. Line-level diffing also has no concept of a move: relocating a block appears as a deletion at the old position plus an insertion at the new one, so a reordered document reads as a full rewrite even though the content is the same. Understanding that is what makes sense of the format and sort buttons being placed before the comparison in the workflow.
Normalize first, compare second
Two buttons exist specifically to remove noise. Format both sides rewrites left and right with two-space indentation, eliminating differences that come only from whitespace. Sort keys on both sides reorders keys at every nesting level by the same rule, eliminating differences that come only from field order. If the input is not valid JSON, these buttons skip the side that cannot be parsed rather than clearing or damaging what is there. The recommended order is format first, then sort; what remains afterwards is essentially the real change in the data, which is a much smaller set to review.
View modes and swapping the sides
The viewer supports side-by-side and inline modes. Side by side shows the overall distribution of changes across the document, while inline is easier to read when edits are dense and adjacent to each other, and on narrow screens. A swap button exchanges baseline and target in one click, which is how you confirm that the direction of the change is not inverted. Both panes accept direct edits and imports of local .json or .txt files, each side can be copied independently, and clearing resets them to {} so the next comparison starts from an empty state.
Frequently asked questions
- Is the difference count the same as the number of changed lines?
- No. The figure at the top counts changed blocks, and consecutive changed lines are merged into one block, so ten added lines in a row count as a single block. It is a measure of how scattered the edits are rather than an exact line or character count. Use it to judge whether a change is localized or spread across the document.
- Two documents look identical but show a wall of differences — why?
- Almost always key order or indentation. Run format on both sides, then sort keys on both, so the two documents agree on whitespace and key sequence; the differences that remain are the real ones. Array element order counts as data and is never touched by the sort button, so a different array order is a genuine difference rather than noise.
- Can I edit the left pane?
- Yes. Both panes are editable: paste, edit and delete all take effect and the diff is recomputed immediately. By convention the left side holds the baseline and the right side the new version, and the swap button flips them. There is no read-only toggle in the comparison area, so copy any content you need to keep before experimenting.
- Can I compare two files directly?
- Yes. Each pane has its own import button and loads a local file into that side; .json and .txt are both supported, and files are read in the browser rather than uploaded. For large files, format and sort first to reduce the noise, then work through the remaining blocks one at a time instead of scrolling the whole document.