コンテンツへスキップ
JSON Diff
2つのJSONをキーの順序に関わらず比較し、構造的な差分を表示します。
概要
- 2つのJSONを構造として比較し、追加・削除・変更されたフィールドを色分けして表示するツールです。
- Text Diffとは異なり、キーの並び順が異なるだけのJSONは「差分なし」として扱われるため、APIレスポンスや設定ファイルなど、整形ツールによってキー順が変わりやすいデータの比較に向いています。
- 比較処理はすべてブラウザ内で完結します。
使い方
- 左側に比較元、右側に比較先のJSONを入力します。
- 「比較する」ボタンをクリックします。
- 構造的な差分が表示されます(+: 追加、-: 削除、変更なしの箇所はそのまま表示)。
入力例・出力例
入力
比較元:
{"name":"my-app","version":"1.0.0"}
比較先:
{"version":"1.1.0","name":"my-app"}出力
"name": "my-app", - "version": "1.0.0", + "version": "1.1.0",
利用シーン
- APIレスポンスの変更前後を比較し、フィールドの追加・削除・変更を確認する
- 設定ファイル(package.jsonなど)の差分を、キー順序の入れ替えに惑わされずに確認する
- テストで期待するJSONと実際に出力されたJSONが一致しているか確認する
よくある質問
配列の要素の順序が変わった場合はどうなりますか?
配列の要素順は意味を持つデータとして扱われるため、オブジェクトのキー順とは異なり、順序が変わると差分として検出されます。
Text Diffとの違いは何ですか?
Text Diffは行単位のテキスト比較のため、キー順序が変わるだけでも差分として表示されます。JSON Diffは構造として比較するため、キー順序の違いは無視されます。
入力したJSONは外部に送信されますか?
いいえ。比較処理はすべてブラウザ内で完結します。
注意点
- 比較前に両方のJSONが有効な構文であるか検証されます。不正なJSONの場合はエラーメッセージが表示されます。
- 内部的にはキーをソートした正規形へ変換してから比較するため、非常に大きなJSONでは処理に時間がかかる場合があります。