Diff JSON
Comparez deux documents JSON et voyez exactement quels champs ont été ajoutés, supprimés ou modifiés
JSON A (gauche / avant)
JSON B (droite / après)
Diff JSON
Comparez deux documents JSON et voyez exactement quels champs ont été ajoutés, supprimés ou modifiés
Fonctionnalités
- Diff structurel entre deux valeurs JSON — objets, tableaux et primitives sont parcourus correctement (null est traité comme un scalaire, pas un objet, corrigeant le bug typeof null)
- Chaque différence est rapportée comme un chemin JSON Pointer RFC 6901 (ex. `/users/0/email`) pour naviguer directement au nœud exact dans des données profondément imbriquées
- Les entrées modifiées affichent les valeurs avant ET après côte à côte, donc on voit si 'active' est passé true→false ou si un nombre a changé
- Compteurs récapitulatifs : ajoutés, supprimés, modifiés et feuilles inchangées — l'échelle du diff d'un coup d'œil avant de lire le détail par chemin
- Le rapport d'erreur d'analyse par côté indique quelle entrée a échoué et inclut le message de parsing du moteur JavaScript — vous ne devinez pas si A ou B est malformé
- Le bouton Copier le rapport émet le diff complet (sections Ajoutés / Supprimés / Modifiés plus compteur inchangé) en texte brut — à coller dans une revue de code ou un message de commit
- Charger un exemple remplit les deux volets avec un petit exemple réaliste (enregistrement utilisateur avec changements de rôle + adresse) pour voir le diff fonctionner sans rien taper
- Purement côté client : JSON A et JSON B sont analysés et comparés dans votre navigateur ; rien n'est téléversé, et l'outil fonctionne hors-ligne après chargement
Mode d'emploi
- Collez votre JSON « avant » dans le textarea de gauche (JSON A) et le JSON « après » à droite (JSON B).
- Cliquez Comparer. Le diff est calculé récursivement ; les objets sont comparés par clé, les tableaux par index.
- Lisez les compteurs : combien de clés ajoutées, supprimées, modifiées, et combien de feuilles correspondent.
- Faites défiler les listes par chemin pour voir quels chemins JSON Pointer ont changé ; les lignes modifiées montrent avant → après.
- Cliquez Copier le rapport pour obtenir tout le diff en texte brut — utile pour notes de revue, rapports de bug ou messages de commit.
- Utilisez Charger un exemple pour voir un exemple fonctionnel avant de coller vos données.
Conseils et bonnes pratiques
- Passez les deux côtés par JSON Formatter d'abord si vous voulez qu'un diff texte voie aussi les documents structurellement égaux comme sans changement.
- Pour les grands tableaux où l'ordre compte, cet outil est exactement bon ; pour les sets, pré-triez par une clé stable.
- La sortie de chemin est RFC 6901, donc vous pouvez la passer directement à des libs comme fast-json-patch pour appliquer les changements programmatiquement.
- Collez le rapport dans les descriptions PR pour montrer aux reviewers exactement ce qui a changé dans un JSON de config ou de fixture.
- Si les erreurs de parsing pointent une colonne spécifique, le message moteur inclut souvent ligne/colonne depuis des parseurs json5 — ici on utilise le strict JSON.parse, donc ligne/colonne vient de l'hôte.
FAQ
Comment les tableaux sont-ils comparés — par index ou par valeur ?
Par index. L'élément 0 de A est comparé à l'élément 0 de B, 1 à 1, etc. Si A est plus long, les indices supplémentaires sont rapportés comme Supprimés ; si B est plus long, la queue supplémentaire est Ajoutée. Rapide et prévisible, mais une insertion en tête d'un grand tableau cascade en de nombreuses entrées « modifié ». Pour les comparaisons insensibles à l'ordre (sets d'IDs uniques), triez les deux tableaux d'abord ou pré-traitez en objets clés par l'identifiant.
Quelle est la notation du chemin dans le résultat ?
JSON Pointer RFC 6901 : les chemins sont des tokens séparés par des slashs qui descendent dans l'arbre JSON. `/users/0/email` signifie « la propriété email de l'élément 0 de users ». Les clés contenant `~` sont échappées en `~0`, les slashs en `~1`. La racine elle-même est `/`. C'est la même notation utilisée par les outils de patch, JSON Schema instancePath et le hover de pointer dans json-formatter.
Comment null est-il géré ?
null est traité comme une feuille, pas comme un objet — même si typeof null === 'object' en JavaScript. Donc {a: null} vs {a: {}} apparaît comme modifié plutôt que de descendre dans un objet vide. {a: null} vs {a: null} compte comme une feuille inchangée, et {a: null} vs {a: 0} apparaît comme modifié avec avant=null après=0.
Le diff gère-t-il les clés avec des caractères spéciaux ?
Oui. Les clés contenant points, slashs, crochets ou tildes sont échappées JSON-Pointer dans la sortie de chemin — `~` devient `~0`, `/` devient `~1`. Une clé littéralement nommée `a/b` apparaît comme `/a~1b` dans le chemin, sans ambiguïté réversible.
Pourquoi le compteur inchangé ne correspond-il pas à mes attentes ?
Inchangé est compté au niveau des FEUILLES — primitives égales entre A et B. Un objet profondément imbriqué dont le sous-arbre est entièrement identique contribue une entrée inchangée par feuille, pas une pour tout le sous-arbre. Cela rend le compteur un vrai contrôle : « combien de valeurs primitives sont restées les mêmes ».
Que se passe-t-il si un côté est null ou vide ?
Une entrée vide parse comme null (donc `{a:1}` vs vide compare contre null et rapporte tout l'objet comme ajouté). Un `null` littéral est un document JSON valide ; comparer deux nulls donne zéro ajouté/supprimé/modifié et un inchangé. Si les deux entrées sont vides, le diff rapporte trivialement zéro partout.
Mon JSON est-il envoyé quelque part ?
Non. Les deux zones de texte restent dans votre navigateur ; le diff tourne dans le même contexte JavaScript qui a rendu la page. L'onglet Réseau de DevTools ne montre aucune requête au clic Comparer. L'outil fonctionne hors-ligne après le cache de la page.
Quelle différence avec un diff texte ligne par ligne ?
Un diff texte comme `diff a.json b.json` opère sur les caractères et sauts de ligne : reformatez les mêmes données et il s'illumine. Ceci est un diff STRUCTUREL : `{"a":1, "b":2}` et `{"b":2, "a":1}` sont identiques (zéro diff). Il ne se soucie pas de l'indentation, des espaces de fin ou des styles de commentaires. Utilisez un diff texte si le formatage compte ; celui-ci si les données comptent.