JSON Array Diff Tool

Paste or upload your JSON arrays into the two editor panels. The tool parses both payloads using a Web Worker and runs a recursive diff engine entirely in your browser. No data is sent to any server. Results appear instantly with color-coded differences in Side-by-Side, Unified, and Tree views.

Yes. All JSON parsing, comparison, and rendering happens inside your browser. Your API responses, customer records, authentication payloads, and proprietary data never leave your device. There are no servers, no network requests, no uploads, and no logs. The tool works fully offline after the initial page load.

Yes. The recursive diff engine handles any nesting depth — deeply nested objects, arrays of arrays, mixed arrays with objects, and all primitive types (strings, numbers, booleans, null). It recursively traverses every branch and reports differences at any depth.

Added keys appear with green highlighting and a + icon. Removed keys appear with red highlighting and a - icon. Modified values appear with amber highlighting and a ~ icon. Type changes (e.g., string → number) are highlighted separately with a T icon. Unchanged nodes are shown in muted styling. All states are indicated with both color and icon for accessibility.

The tool validates JSON syntax before comparison. If either payload contains invalid JSON, a human-readable error message is displayed showing the line number, column number, character index, and a short explanation. The error location is highlighted in the editor. Only valid JSON is compared.

Click the Upload button on each panel and select your .json or .txt files. The tool reads them using the HTML5 FileReader API and displays the content in the editors. Comparison begins automatically with a 150ms debounce. You can also drag and drop files directly onto the editor panels.

Use the Dashboard summary cards to instantly see Keys Added, Keys Removed, and Values Modified counts. Then switch to Tree View and click 'Expand Differences Only' to collapse all unchanged branches. Use the navigation arrows (First Diff, Previous, Next, Last) to jump directly to each change.

Yes. Toggle the 'Ignore Array Order' setting ON. When enabled, arrays are compared by content rather than by index position. Two arrays with the same elements in different order will be considered equal. Disable it (default) for index-sensitive comparison.

Yes. Export the comparison results as TXT Summary, CSV Report, or JSON Report. The TXT summary provides a human-readable list of all differences. The CSV report includes path, type, old value, and new value for spreadsheet analysis. The JSON report contains structured diff data for programmatic use.

If your payload exceeds 5 MB, a large payload notice is displayed. Processing continues inside the Web Worker using chunked parsing and progressive rendering. The dashboard shows nodes processed and objects parsed in real time. The browser UI remains fully responsive during comparison.

Five smart toggles: Ignore Array Order (compare by content vs index), Ignore Property Order (object key ordering does not affect comparison, ON by default), Ignore Whitespace (normalize whitespace in string values, ON by default), Ignore Null vs Missing (treat null and missing as equal), and Ignore Case (case-insensitive string comparison).

Yes. Each editor panel has Beautify and Minify buttons. Use Beautify to format JSON with proper indentation before comparison. Use Minify to compact JSON to a single line. Validation is also available to check syntax. Formatting never modifies the original input unless you request it.