JSON Diff: Zwei JSON-Dateien online vergleichen
Zwei JSON-Schnipsel einfügen, formatieren und nebeneinander vergleichen. Validierung, hübsches Formatieren und Minifizieren sind eingebaut.
Was ist das JSON-Vergleichstool?
Ein kostenloses Browser-Tool zum Vergleichen von zwei JSON-Dokumenten. Füge die alte Version links ein, die neue rechts, und die Unterschiede leuchten Zeichen für Zeichen auf. Nichts verlässt deinen Rechner.
Es nutzt das native JSON.parse deines Browsers für die Validierung. Es gibt einen Format-Button, wenn dein JSON eine einzige minifizierte Riesenzeile ist, einen Minify-Button für den umgekehrten Fall und Live-Validierung, die Syntaxfehler beim Tippen markiert.
Wenn du je einen 6.000-Zeilen-Diff einer openapi.json in einem GitHub-PR angestarrt hast und versucht hast, das eine Feld zu finden, das einen Downstream-Client zerstört hat: Das ist das Tool, das dich in Sekunden dorthin bringt.
Wie der Diff tatsächlich funktioniert
Der Diff arbeitet zeichenweise und wird anschließend mit semantischer Nachbearbeitung aufgeräumt, sodass die Hervorhebungen auf sinnvollen Blöcken landen statt auf zufälligen Zeichen. Einfügungen erscheinen grün im rechten Bereich, Löschungen rot im linken.
JSON hat seine eigenen Eigenheiten, die die Spezifikation festhält. Die JSON-Spezifikation in RFC 8259 definiert Objekte als ungeordnet, das Umsortieren von Schlüsseln ist also technisch ein No-op, auch wenn ein Text-Diff es markiert. Wir behandeln das mit einem Format-Button auf jeder Seite: beide formatieren, dann vergleichen, und die Reihenfolge ist konsistent. Für tiefere strukturelle Arbeit schau dir JSON Patch (RFC 6902) oder das einfachere JSON Merge Patch-Format (RFC 7396) an, die zwei Standardwege, eine JSON-Änderung als Daten zu beschreiben.
Wenn die Reihenfolge fürs Hashen oder Signieren wichtig ist, ist die relevante Spezifikation RFC 8785 (JSON Canonicalization Scheme). Schlüssel sortieren, Zahlenformatierung normalisieren, dann diffen.
JSON in drei Schritten vergleichen
Zwei Textbereiche, ein Diff. Keine Anmeldung, kein Upload, kein Server-Roundtrip.
- 1
JSON einfügen oder hochladen
Füge das alte JSON links ein, das neue rechts. Oder klicke auf Upload auf einer der Seiten, um eine .json-Datei direkt zu laden. Der Sample-Button füllt beide Bereiche mit einem kleinen Beispiel, falls du das Tool zuerst in Aktion sehen möchtest.
- 2
Beide Seiten formatieren für einen fairen Vergleich
Klicke auf jedem Bereich auf Format, um mit zwei Leerzeichen Einrückung hübsch auszugeben. Das normalisiert Whitespace und Zeilenumbrüche, sodass der Diff echte Datenänderungen hervorhebt und keine Formatierungsunterschiede. Das Validierungs-Badge wird grün, wenn dein JSON sauber geparst wird.
- 3
Den Diff lesen
Löschungen erscheinen rot hervorgehoben links, Einfügungen grün hervorgehoben rechts. Scroll auf einer Seite, und die andere folgt. Die Änderungszähler in jedem Header sagen dir, wie viele unterschiedliche Edits der Diff gefunden hat.
Wann ein JSON-Diff das richtige Werkzeug ist
IAM-Policy-Änderungen vor dem Anwenden prüfen
Füge die aktuelle Ausgabe von aws iam get-policy-version gegen das vorgeschlagene JSON ein, um genau zu sehen, welche Action-Einträge hinzugefügt wurden oder ob jemand "Resource": "*" in eine zuvor spezifische Statement geschoben hat. Die AWS-Konsole sortiert Statements beim Speichern um, was einen GitHub-Diff irreführend macht; formatiere hier beide Seiten und die echte Änderung wird offensichtlich.
Stiller Drift in Terraform-Plänen erkennen
Wenn terraform show -json tfplan einen 4-MB-Blob zurückgibt, ist Augenmaß aussichtslos. Vergleiche den heutigen Plan mit dem von gestern, um die aws_security_group_rule ans Licht zu bringen, die jemand unter einem Refactor-PR hinzugefügt hat, oder den lifecycle.ignore_changes-Block, der leise verschwunden ist.
OpenAPI-Schema-Änderungen vor dem Merge reviewen
Ein 6.000-Zeilen-Diff von openapi.json ist unlesbar, wenn ein Code-Generator paths alphabetisch umsortiert. Beide Seiten formatieren, vergleichen, und die echte Änderung kommt zum Vorschein: ein required-Feld, das zu CreateOrderRequest hinzugefügt wurde, oder eine 200-Antwort, deren Schema heimlich von string auf string | null gewechselt hat.
package-lock.json nach einem Merge debuggen
Nach dem Lösen eines package-lock.json-Konflikts vergleiche deine aufgelöste Datei mit dem Lockfile der main, um ein transitives Downgrade zu fangen. npm löst denselben Semver-Bereich auf verschiedenen Maschinen manchmal in unterschiedliche exakte Versionen auf, was die eigentliche Ursache von "läuft auf meiner Maschine, fällt in der CI" ist. Lies die package-lock.json-Doku dazu, was jedes Feld bedeutet.
Elasticsearch-Mappings über Umgebungen hinweg vergleichen
Hol GET /my-index/_mapping aus Staging und Prod, wirf beide in den Diff. Prod hat vielleicht noch "type": "text" auf einem Feld, das Staging letzten Sprint auf "keyword" migriert hat, weshalb die Aggregation in Prod nichts zurückgibt und lokal funktioniert. Mappings sind fünf oder sechs Ebenen tief verschachtelt, und ein Text-Diff vergräbt das im Rauschen.
Wackelige API-Mocks reproduzieren
Wenn ein Playwright-Test lokal läuft und in der CI versagt, fang den JSON-Response-Body ein, den der Test tatsächlich gesehen hat, und vergleiche ihn mit dem Fixture in deinem Repo. Oft ist es ein createdAt-Timestamp oder ein traceId-Feld, das niemand gepinnt hat, und der strukturelle Diff macht den Übeltäter offensichtlich, statt dich vor eine Wand aus formatiertem Text zu setzen.
JSON-Schnellreferenz
Ein kurzer Spickzettel zu den Parsing-Edge-Cases, die dieses Tool am häufigsten zutage fördert. Alles basiert auf der JSON-Spezifikation.
| Topic | What this tool does |
|---|
| Reihenfolge der Objektschlüssel | Laut Spec ungeordnet. {"a":1,"b":2} ist gleich {"b":2,"a":1}. Nutze Sort keys zum Normalisieren vor dem Diffen. |
|---|
| Array-Reihenfolge | Geordnet. [1,2,3] ist nicht gleich [3,2,1]. Sortiere manuell, wenn die Reihenfolge für deinen Anwendungsfall keine Rolle spielt. |
|---|
| Trailing Commas | Nicht erlaubt. { "a": 1, } ist im Standard-JSON ein Parse-Fehler. In den Obermengen JSON5/JSONC erlaubt: vorher entfernen. |
|---|
| Kommentare | Nicht erlaubt. // so ist ein Parse-Fehler. JSON5 und JSONC akzeptieren sie; dieses Tool folgt der strikten RFC-8259-Grammatik. |
|---|
| Zahlen | Werden als 64-Bit IEEE 754 Floats geparst. 0.1 + 0.2 = 0.30000000000000004. Ganzzahlen über 2^53 − 1 verlieren Präzision; speichere Snowflake-IDs als Strings. |
|---|
| Doppelte Schlüssel | Die Spec nennt das undefiniertes Verhalten. Die meisten Parser behalten das letzte Vorkommen. Der Diff zeigt alle, was du beim Auditieren von Konfigurationsdateien meist willst. |
|---|
| Encoding | Nur UTF-8. RFC 8259 verbietet ein UTF-8 BOM am Anfang des Dokuments; manche Parser akzeptieren es trotzdem, die Spec aber nicht. |
|---|
| Null vs. fehlend | Ein Schlüssel mit Wert null ist vorhanden. Ein fehlender Schlüssel ist nicht vorhanden. Anders als JavaScripts undefined, das keine JSON-Repräsentation hat. |
|---|
JSON Diff: häufige Fragen
Speichert oder lädt das mein JSON irgendwohin hoch?
Nein. Der Diff läuft komplett in deinem Browser. Nichts wird an einen Server gesendet, geloggt oder gespeichert. Füge eine interne API-Antwort oder eine IAM-Policy ein und schließe den Tab; es bleibt keine Kopie zurück. Zur Überprüfung öffne die DevTools, wechsle in den Network-Tab und schau zu: Es gibt keine ausgehenden Requests, wenn du vergleichst.
Tauchen das Umsortieren von Schlüsseln oder Pretty-Printing von JSON als Änderung auf?
Ja, beides. Ein Text-Diff vergleicht Zeichen Zeile für Zeile, also tauchen Reformatierungen, Schlüssel-Umsortierungen oder Whitespace-Änderungen als Unterschiede auf, selbst wenn die Daten identisch sind. Klicke zuerst auf beiden Bereichen den Format-Button, dann fokussiert sich der Diff auf echte Datenänderungen. Für einen voll strukturellen Vergleich, der die Schlüsselreihenfolge ignoriert, sortiere die Schlüssel auf beiden Seiten, bevor du diffst.
Spielt die Reihenfolge der Schlüssel in einem JSON-Objekt eine Rolle?
Bei Objektschlüsseln nein: Die JSON-Spec sagt, dass Objekte ungeordnet sind, also repräsentieren {"a":1,"b":2} und {"b":2,"a":1} dieselben Daten. Ein zeichenweiser Diff markiert die Umsortierung trotzdem, deshalb ist der Format-Button wichtig. Arrays sind anders: [1,2,3] und [3,2,1] sind nicht gleich, weil die Array-Reihenfolge in JSON Bedeutung hat.
Warum ist 0.1 + 0.2 in meinem Diff nicht gleich 0.3?
Wegen IEEE 754 Fließkomma. 0.1 + 0.2 ist tatsächlich 0.30000000000000004, und JSON.parse liest Zahlen als 64-Bit-Floats. Große Ganzzahlen treffen dieselbe Grenze: Alles über 2^53 - 1 (9007199254740991) verliert Präzision, also überlebt eine Twitter-artige Snowflake-ID keinen Roundtrip. Wenn Präzision wichtig ist, speichere sie als String.
Kann ich JSON mit Kommentaren oder Trailing Commas einfügen?
Standard-JSON erlaubt beides nicht. { "a": 1, } oder // Kommentar geben dir einen Parse-Fehler. Das ist JSON5 oder JSONC (das Format, das VS Code für settings.json nutzt), eine Obermenge. Entferne zuerst die Kommentare und Trailing Commas. Wir folgen bewusst der strikten RFC-8259-Grammatik, damit der Diff dem entspricht, was deine API tatsächlich akzeptiert.
Wie groß darf die JSON-Datei sein, bevor es langsam wird?
Bis zu ein paar MB ist gut, im Sub-Sekunden-Bereich. Über 10 MB beginnt der Browser, es zu spüren, hauptsächlich weil das Rendern des Diffs (nicht das Berechnen) teuer wird. Für Exports ab 50 MB filtere beide Seiten zuerst mit jq auf den Teilbaum, der dich interessiert, und füge das ein.
Datenschutz und wie das funktioniert
Dein JSON verlässt deinen Browser nie. Parser, Formatter und Diff laufen alle lokal auf deinem Rechner. Keine Analytics auf deiner Eingabe, keine Logs, kein "hilfreicher" Cloud-Roundtrip. Das Parsen nutzt das native JSON.parse des Browsers, und die JSON-Spec, der wir folgen, ist RFC 8259.