Home / Blog / JSON tools

JSON tools

Compare JSON in VS Code: Separate Text and Data Differences

Compare two JSON files in VS Code, control formatting noise, and inspect object keys, array order and exact numbers before merging a change.

Open an explicit left and right comparison

Visual Studio Code can compare two JSON files using its normal text diff editor. In the Explorer, select the first file for comparison, then compare the second file with the selected file. Name or label the copies clearly enough that you know which one is the baseline and which one is the proposed change before accepting an edit.

The official comparison guide also documents comparing the active file with another file, the clipboard or its saved version. Those choices answer different questions. A comparison with the last saved content is useful for an unsaved edit; it does not automatically compare against the last committed Git version.

Keep the original files intact while investigating. If you normalize formatting for easier review, create working copies or use your project's existing formatting process so the evidence of the original difference remains available.

Identify what the highlighted text actually means

Consider these two documents. Their object properties appear in different orders, but the values associated with those names match. Their roles arrays have also changed order, which is a separate decision your review must address.

{"id":"acct-7","enabled":false,"roles":["reader","writer"]}
{"roles":["writer","reader"],"enabled":false,"id":"acct-7"}

A text diff can highlight most of these lines without telling you whether your application cares about the changes. JSON objects represent named members; an application's semantic comparison often ignores their presentation order. JSON arrays are ordered sequences. Do not sort an array merely because it makes a diff look smaller.

For a permissions API that defines roles as a set, you might intentionally compare normalized unique role names. For an ordered workflow, task list or drawing stack, reordering can change behavior. Establish that contract from the consuming application, then document the normalization you use.

Reduce formatting noise without hiding value changes

Format both valid JSON documents with the same indentation before a second comparison. This makes a changed property easier to spot when one input was minified. Keep string contents unchanged: spaces inside a display label or a serialized command may be meaningful even when spaces between JSON tokens are not.

Check additions and deletions independently. A missing property, a property set to null and a property set to an empty string can trigger three different code paths. False and zero must not disappear because a helper filters values by truthiness.

For example, {"limit":0} and {} should produce a difference when zero means no items and the missing field means use the service default. A reviewer needs that domain explanation alongside the highlighted line.

Protect identifiers and numeric precision

Do not normalize arbitrary JSON by parsing and reserializing it through an unsuitable number type. The tokens 9007199254740992 and 9007199254740993 are distinct integers, even though an ordinary JavaScript Number cannot distinguish both exactly. A comparison that rounds both inputs can hide a real change.

The JavaScript safe-integer documentation explains that boundary. Inspect raw numeric text or use a lossless parser when the contract needs larger integers. A string identifier such as "0009" must also remain a string; converting it to numeric nine changes both type and representation.

Duplicate object member names are another reason to retain original text. Different consumers may choose different surviving values or reject the document. Resolve duplicate names explicitly instead of accepting whichever member a normalizing parser happened to retain.

Use a structural check to supplement the editor

The local JSON Compare Tool accepts two documents and reports structural differences. It compares array positions, retains precise numeric comparison and rejects duplicate member names. Try the two role fixtures above, then make their array order identical: the remaining object-key reordering should not create a value difference.

Next remove enabled from one document and confirm that the missing member is reported. Replace one input with malformed JSON and verify that an old comparison is cleared. These cases test the distinction between equality, a real data change and an input that was never valid enough to compare.

After reviewing, save the intended file and run the consuming application's checks. Neither a clean text diff nor a structural equality result proves that the payload is authorized, complete for a business process or compatible with a changed server contract.