JSON Nexus Docs

JSON Nexus is a client-side tool for parsing and comparing JSON data. It provides two main tabs:

• JSON to Table Grid: Flattens nested objects and splits arrays into columns and rows with CSV and Excel export options.
• JSON Compare & Diff: Compares two JSON objects side-by-side with optional filters for structure and values.

JSON Nexus shapes nested data structures into a table using two options:

1. Flatten Nested Objects

Recursive object properties are flattened into dot-separated header strings. If disabled, sub-objects are kept intact as simple stringified JSON.

2. Split Arrays into Rows (Cartesian Splitting)

If a field contains multiple array values (e.g. `skills: ["TypeScript", "Bun"]`), splitting will perform a Cartesian expansion. It duplicates the parallel property values and spans them over multiple distinct rows recursively.

{
  "id": "USR-101",
  "profile": {
    "fullName": "Alice Vance"
  },
  "skills": ["TypeScript", "Bun"]
}

[
  { "id": "USR-101", "profile.fullName": "Alice Vance", "skills": "TypeScript" },
  { "id": "USR-101", "profile.fullName": "Alice Vance", "skills": "Bun" }
]

Parsed data is rendered in a table powered by @tanstack/react-table.

• Sorting & Filtering: Columns can be sorted alphabetically or numerically, and a global search filter matches values across the active grid.
• CSV & Excel Exports: Generates standard CSV files or binary `.xlsx` files using the `xlsx` package for local download.

JSON Nexus provides three diff filter modes to view changes side-by-side:

📊 Granular (Default)

Standard diff showing all text modifications, additions, and deletions.

🔧 Structure Only

Compares schemas by mapping leaf nodes to their types (e.g., `"<string>"`, `"<number>"`). This mode isolates added, deleted, or migrated fields.

💎 Values Only

Ignores unique structural updates (additions and removals). It uses a recursive intersection algorithm to isolate **only shared keys** and display their value changes, keeping the rest completely hidden.

Often, two JSON objects represent the exact same database records, but their fields are positioned differently or their array items are shifted in index order.

Checking the **`Ignore Order (Keys & Arrays)`** option in the Action Bar recursively:

1. Sorts all object fields **alphabetically** by key.
2. Sorts all array elements **alphabetically** by their stringified value.

This normalizes the structural positioning on both sides, ensuring Monaco only highlights true value changes rather than simple key re-ordering!