JSON Diff
2つのJSONドキュメントを貼り付けると、その間でどのキーが追加、削除、変更されたかを正確に確認できます。
仕組み
両方の入力はJSONとして解析され、その後キーごと、インデックスごとに比較されます。右側にのみ存在するキーは追加、左側にのみ存在するキーは削除、両側に存在するが値が異なるキーは変更として扱われます。オブジェクトのキーの順序は関係なく、値だけが問題になります。
仕組み
両方の入力はまずJSON.parseを通ります。そのため、どちらかが有効なJSONでない場合、意味のないdiffの代わりに、パーサー自身が問題を指し示すエラーメッセージが表示されます。比較処理は、解析された2つの構造を再帰的にたどります。オブジェクトの場合は両方のキー集合の和集合を取り各キーに再帰し、配列の場合はインデックスごとに比較し、末端の値は完全に同一にシリアライズされる場合にのみ等しいとみなされます。すべての差異はuser.address[1].zipのようなパスとして出力され、追加・削除・変更のいずれかにタグ付けされ、最後に件数として集計されます。
diffはテキストではなく解析された値に対して実行されるため、フォーマットの違いは見えません。インデント、キーの順序、空白の違いはノイズを一切生みません。これこそが行ベースのテキストdiffに対する最大の利点です。理解しておくべきトレードオフは配列の位置合わせです。これは位置ベースであるため、長い配列の先頭に1つの要素を挿入すると、それ以降のすべてのインデックスが「変更」として報告され、末尾に1つの追加が加わります。すべてが1つずつずれているように見える大量の変更エントリを目にしたら、それを数十件の独立した編集としてではなく、「この配列の早い段階で何かが挿入または削除された」と読み取ってください。
解析と比較は、すべてこのページのJavaScript内で行われます。DevToolsのNetworkタブを開いて「比較する」をクリックしてみてください。あなたのJSONを運ぶリクエストは一切発生しないため、秘密情報を含むAPIレスポンスや設定ファイルはあなたのマシン内にとどまります。