DT Dev Tools

JSON Diff — JSON-Vergleich

Vergleichen Sie zwei JSON-Objekte rekursiv und markieren Sie hinzugefügte, entfernte und geänderte Schlüssel – lokal im Browser, ohne Upload Ihrer Daten.

🔒 Läuft vollständig in Ihrem Browser — nichts wird hochgeladen

 
Advertisement

Was JSON Diff macht

JSON Diff vergleicht zwei geparste JSON-Werte und zeigt an, was sich an jedem Pfad geändert hat. Das ist nützlich, um Änderungen an API-Antworten, Konfigurationsanpassungen, Fixture-Updates, Feature-Flag-Payloads, Webhook-Beispiele, Übersetzungsdateien und generierte Daten zu prüfen, wenn ein zeilenbasierter Diff zu unübersichtlich ist. Statt Änderungen an der Interpunktion anzuzeigen, durchläuft das Tool Objekte und Arrays rekursiv und kennzeichnet Pfade als hinzugefügt, entfernt, geändert oder unverändert. Da beide Seiten zuerst als striktes JSON geparst werden, werden Syntaxfehler vor dem Vergleich erkannt. So lassen sich ungültige Eingaben von echten strukturellen Unterschieden trennen.

Der Bericht verwendet farbcodierte Zeilen, damit wesentliche Änderungen schnell ins Auge fallen. Hinzugefügte Werte erscheinen grün, entfernte Pfade rot, geänderte Werte bernsteinfarben und unveränderte primitive Pfade in gedämpftem Text. Den Bericht im Klartext können Sie in ein Issue, einen Pull Request, eine Debugging-Notiz oder ein Test-Review kopieren, wenn Sie erklären müssen, wie sich zwei Payloads unterscheiden.

Privater Workflow im Browser

Die gesamte Verarbeitung findet in Ihrem Browser mit clientseitigem JavaScript statt. Das Tool lädt weder Snippets noch Konfigurationswerte, generierte Daten, Abfragetexte oder kopierte Beispiele auf einen Server hoch und erfordert kein Konto. Dieses rein lokale Modell ist bei Entwickler-Tools wichtig, weil die eingefügten Inhalte oft echten Anwendungsdaten ähneln: API-Antworten, Logs, Beispiele im Stil von Umgebungsvariablen, Datenbankabfragen, Markup aus Entwürfen oder Werte aus Debugging-Sitzungen im Produktivsystem. Die lokale Verarbeitung senkt das Risiko und hält die Interaktion schnell, da keine Netzwerkrundreise nötig ist.

Die Oberfläche ist bewusst kompakt gehalten, damit Sie Eingaben einfügen, Optionen anpassen, die Ausgabe prüfen, kopieren und zu Ihrem Editor zurückkehren können. Ergebnisse sollten dennoch geprüft werden, bevor Sie sie committen, öffentlich teilen oder in einem Produktions-Workflow verwenden. Browser-Tools eignen sich hervorragend für schnelle Prüfungen und Vorbereitungen, können aber nicht jede Projektkonvention, jede Datenklassifizierungsregel oder jede anwendungsspezifische Validierungsanforderung kennen.

Praktische Tipps

Verwenden Sie dieses Tool für kleine bis mittelgroße JSON-Snippets, die Sie schnell verstehen möchten. Sehr große Dokumente lassen sich in einem dedizierten Editor oft leichter vergleichen, besonders wenn Arrays umsortierte Elemente oder Datensätze ohne stabile Kennungen enthalten. Dieser Browser-Diff vergleicht Array-Positionen direkt, sodass ein vorn eingefügtes Element dazu führen kann, dass spätere Array-Einträge als geändert erscheinen, obwohl die Objektidentitäten konzeptionell dieselben sind. Normalisieren Sie generierte Zeitstempel, zufällige IDs und umgebungsspezifische Werte vor dem Vergleich, damit sich echte Änderungen am Vertrag leichter erkennen lassen.

So verwenden Sie

  1. Original-JSON einfügenFügen Sie links das Basisobjekt oder -array ein.
  2. Geändertes JSON einfügenFügen Sie rechts das zu vergleichende Objekt oder Array ein.
  3. VergleichenPrüfen Sie die farblich markierten hinzugefügten, entfernten und geänderten Pfade.

Häufig gestellte Fragen

Welche Unterschiede werden angezeigt?
Der Diff meldet hinzugefügte, entfernte, geänderte und unveränderte verschachtelte Pfade für Objekte und Arrays.
Werden Schlüssel sortiert?
Nein. Das Tool vergleicht die geparsten Werte rekursiv und zeigt die Pfade in der Reihenfolge des Durchlaufs an.
Wird das JSON hochgeladen?
Nein. Beide Eingaben werden lokal im Browser geparst und verglichen.
Advertisement