JSON-Diff

Vergleiche zwei JSON-Dokumente nach Struktur statt nach Zeile. Meldet hinzugefügte, entfernte und geänderte Pfade, mit Option, die Array-Reihenfolge zu ignorieren. Läuft vollständig in deinem Browser.

Vergleiche nach Struktur, nicht nach Zeile. Füge zwei Dokumente ein und erhalte einen pfadweisen Bericht darüber, was hinzugefügt, entfernt oder geändert wurde. Da der Vergleich die geparsten Werte durchläuft, erscheinen Neuformatierung oder Schlüssel-Neuanordnung nicht als Unterschied.

Unterschiede

Warum ein Text-Diff das falsche Werkzeug für JSON ist

Zeilendiffs sehen Formatierung, nicht Bedeutung

Ein standardmäßiger zeilenbasierter Diff behandelt JSON wie Prosa. Rücke eine Datei von zwei auf vier Leerzeichen ein und jede Zeile wird als geändert markiert. Verschiebe einen Schlüssel vom Anfang eines Objekts ans Ende und du erhältst eine Löschung plus eine Einfügung, obwohl der geparste Wert exakt derselbe ist. Bringe ein langes Array in eine einzelne Zeile und der gesamte Block leuchtet auf.

Ein struktureller Diff parst zunächst beide Seiten und durchläuft dann die resultierenden Werte. Formatierung, Schlüsselreihenfolge und Leerzeichen sind verschwunden, bevor der Vergleich beginnt, sodass nur echte Unterschiede in den Daten gemeldet werden können. Das macht die Ausgabe kurz genug, um sie tatsächlich zu lesen.

Pfade, nicht Zeilennummern

Jeder Unterschied hier wird gegen einen Pfad wie user.roles[2] oder meta.updated gemeldet. Ein Pfad überlebt Bearbeitungen an anderer Stelle im Dokument, was eine Zeilennummer nicht tut, sodass du denselben Bericht in ein Ticket oder eine Code-Review einfügen kannst und er auch eine Woche später noch auf die richtige Stelle zeigt.

Die drei Operationen ordnen sich dem zu, was in einem Baum tatsächlich passieren kann. Ein auf der linken, aber nicht auf der rechten Seite vorhandener Schlüssel ist eine Entfernung, umgekehrt eine Hinzufügung, und ein auf beiden Seiten mit unterschiedlichem Wert vorhandener Schlüssel ist eine Änderung. Typänderungen — ein Feld, das früher die Zahl 1 war und nun der String "1" ist — werden ebenfalls als Änderung gemeldet, und sie verdienen Beachtung, denn sie sind eine häufige Quelle nachgelagerter Fehler, die keine Schemaprüfung abfängt.

Arrays und die Reihenfolgenfrage

Bei Arrays wird strukturelles Diffen eigenwillig. Standardmäßig ist der Vergleich positionell: Index 0 links wird mit Index 0 rechts verglichen. Das ist korrekt für geordnete Daten wie eine Abfolge von Schritten, erzeugt aber ein irreführendes Ergebnis für eine Liste, die eigentlich eine Menge ist — ordne die Elemente neu an und jede Position scheint geändert.

Die Option „Array-Reihenfolge ignorieren" kanonisiert beide Seiten, indem sie Arrays vor dem Vergleich tief sortiert, sodass eine neu geordnete Liste als gleich verglichen wird. Nutze sie für Tag-Listen, Berechtigungsmengen und Abfrageergebnisse ohne garantierte Reihenfolge. Lasse sie aus, wenn die Position eines Elements Bedeutung trägt, denn mit ihr wird ein echter Neuordnungsfehler unsichtbar.

Open-Source-Hinweis: implementiert in Vanilla-JavaScript ohne Drittbibliotheken.

FAQ

Wie unterscheidet sich das von einem normalen Text-Diff?
Ein Text-Diff vergleicht Zeilen, sodass Einrücken oder Neuordnen von Schlüsseln als Änderung erscheint. Dieses Werkzeug parst zunächst beide Seiten, sodass nur echte Unterschiede in den Daten gemeldet werden.
Was bedeuten die Symbole +, - und ~?
Plus ist ein Pfad, der nur im geänderten Dokument vorkommt, Minus nur im Original, und Tilde ist ein Pfad, der auf beiden Seiten mit unterschiedlichem Wert existiert.
Warum wird ein neu geordnetes Array als geändert gemeldet?
Standardmäßig werden Arrays positionsweise verglichen, was für geordnete Daten korrekt ist. Aktiviere „Array-Reihenfolge ignorieren", um sie stattdessen als ungeordnete Mengen zu vergleichen.
Spielt die Schlüsselreihenfolge in einem Objekt eine Rolle?
Nein. Objekte werden nach Schlüssel verglichen, sodass das Verschieben eines Feldes innerhalb eines Objekts niemals einen Unterschied erzeugt. Nur Array-Elementpositionen sind reihenfolgeabhängig.
Wird eine Zahl, die zu einem String wurde, markiert?
Ja. Eine Typänderung wird bewusst als Änderung gemeldet: 1 und "1" verhalten sich nachgelagert sehr unterschiedlich, und die Diskrepanz wird sonst leicht übersehen.
Werden meine Dokumente an einen Server gesendet?
Nein. Beide Seiten werden in deinem Browser geparst und verglichen, sodass nichts hochgeladen, protokolliert oder gespeichert wird.