JSON差分比較
このツールは、JSONペイロードを抽象構文木にパースし、キーの順序と意味を持たない空白を完全に無視する、クライアント側で動作するセマンティック比較エンジンです。主キーによる配列マッチングの設定、型の変化を独立した種類として分類する処理、タブを固めることなく最大100 MBのJSONを扱えるWeb Worker実行、双方向のRFC 6902 JSON Patchのエクスポートと適用、そして共通の祖先に対して2つのブランチを結合し、パスごとの競合解決ができるオプトインの3-wayマージを備えています。
左右を意味的に比較します。キーの順序と空白は無視します。
表示する差分はありません
上に2つのJSONドキュメントを貼り付けてください。比較はWeb Workerで実行され、大きなデータでもページの操作を妨げません。
JSON差分比較はどう動きますか?
標準的な行単位の差分ツール(古典的なUnix diffなど)は、意味のあるデータではなく直列化されたテキストを比較するため、JSONでは失敗します。JSONではRFC 8259により、キーの順序は明示的に任意とされています。{"a":1,"b":2}と{"b":2,"a":1}は同一のオブジェクトを表すのに、テキスト差分エンジンは矛盾する行として検出します。
ToolsByUsの差分エンジンは、分離されたWeb Workerの中でパース済みの抽象構文木(AST)を操作することで、これを解決します。オブジェクトのキーを辞書順に正規化し、3つの設定可能な配列マッチングアルゴリズムを実装しています。
- インデックスマッチング:配列要素を順序位置で厳密に対応付けます(プリミティブのリストではデフォルト)。
- キーマッチング:不変の識別子(
idやuuidなど)でコレクションの実体を対応付けます。順序が入れ替わったリスト項目を、偽の削除と追加のノイズではなく、変更や移動として検出できます。 - 構造類似度:二部マッチングの最大重みマッチングを使い、フィールドの対応が最も高いオブジェクト同士を対応付けます。
スカラーの型変化(文字列"42"が数値42に変わるなど)は、破壊的な置き換えではなく、独立したTYPE_CHANGEイベントとして認識されます。
左と右のサンプル
// Left:
{"id": 1, "tier": "free", "name": "Alpha"}
// Right:
{"name": "Alpha", "id": 1, "tier": "pro"}出力例
// Semantic Diff Result: - tier: "free" (Removed) + tier: "pro" (Added) = id: 1 (Unchanged) = name: "Alpha" (Unchanged, key order ignored)
左と右のサンプル → 出力例
左と右のサンプル
{
"id": 42,
"name": "Ada",
"tags": ["math", "code"],
"active": true
}左と右のサンプル 2
{
"name": "Ada Lovelace",
"id": 42,
"tags": ["math", "code", "analysis"],
"active": false
}出力例
[
{
"op": "replace",
"path": "/active",
"value": false
},
{
"op": "replace",
"path": "/name",
"value": "Ada Lovelace"
},
{
"op": "add",
"path": "/tags/2",
"value": "analysis"
}
]JSON差分比較が対応するオプションとエッジケースは?
| パラメータ | 型 | デフォルト | 動作とエッジケース |
|---|---|---|---|
| キー順の不変性 | 不変 | 常に有効 | オブジェクトのキーは数学的な集合として比較されます。キーの順序が異なっても差分の変更は発生しません。 |
| 配列照合:インデックス | モード | デフォルト | ゼロベースのインデックスで項目を厳密に一致させます。[1, 2, 3]のような単純なスカラー配列に最適です。 |
| 配列照合:キー | モード | 'id' | ユーザー定義の主キープロパティで配列間のオブジェクト項目を一致させます。並べ替え時の誤った追加を防止します。 |
| 配列照合:類似度 | モード | スコア > 0.4 | 共有キーとプリミティブスカラーの等価性に基づくヒューリスティック構造マッチング。 |
| 型変更の分類 | カテゴリ | 有効 | 型の変遷('1' -> 1)を削除+追加ではなく、独立したTYPE_CHANGE操作としてタグ付けします。 |
| メモリ上限 | 制限 | 100 MB | ブラウザタブのメモリ不足クラッシュを防ぐため、ワーカー内のペイロードに明示的な上限を設定します。 |
| スリーウェイマージ | モード | オプトイン | ベース+我々+彼らをページ内で結合(8 MB上限);競合はデフォルトで祖先値となり、パスごとにライブで再解決されます。 |
よくある質問
JSONの差分比較でキーの順序が問題にならないのはなぜですか?
公式のJSON仕様(RFC 8259 Section 4)によれば、JSONオブジェクトは順序を持たない0個以上の名前と値のペアのコレクションです。JSONエンコーダー(Pythonの辞書やGoのマップ反復など)はキーを非決定的な順序で直列化するため、セマンティックな差分比較では、偽の差異を排除するためにキー順序を正規化する必要があります。
キーによる配列のマッチングはどのように動作しますか?
データベースのモデルやAPIレコードの配列では、項目の順序が変わったり削除されたりします。'id'や'uuid'のような主キーを指定すると、差分エンジンは配列内の位置に関係なく、同じキー値を持つ左右のオブジェクトを対応付けます。配列全体の置き換えとして報告する代わりに、フィールドの変化を正確に強調表示します。
この差分からRFC 6902のJSON Patchを生成できますか?
はい。ToolsByUsは仕様に準拠したRFC 6902のJSON Patch配列('add'、'remove'、'replace'、'move'の操作)を生成します。ワンクリックでコピーできるうえ、ドキュメントに直接適用もできます。パッチは往復が保証されています。生成されたパッチを元のドキュメントに適用すると、正確にターゲットのドキュメントになります。
3-wayマージは競合する編集をどう扱いますか?
'Three-way merge'に切り替えて、共通の祖先をBaseとして指定し、両方のブランチのドキュメントを渡してください。片側だけが加えた変更は自動的にマージされます。両側が同じパスに触れた場合、エンジンは競合を記録し、そのパスについてOurs、Theirs、Baseのいずれかを選ぶまで、マージ結果はBaseの値を使います。選ぶたびに出力は即座に再解決され、すべてブラウザ内で完結します。
JSONペイロードはバックエンドのサーバーに送られますか?
いいえ。ToolsByUsはバックエンドを持たない静的ウェブサイトです。パース、ASTの走査、差分の生成は、ブラウザの専用Web Workerスレッドの中で100%実行されます。ドキュメントの読み込み中はネットワークリクエストが完全に無効で、厳格な自動E2Eテストで検証されています。
タブを固めずに差分を取れるJSONドキュメントのサイズはどのくらいですか?
重いパースと走査はすべてWeb Workerで動き、行は仮想化スクロールで描画されます(ビューポートに見えている要素だけがDOMに存在します)。そのためWorkerの上限である100 MBまでのドキュメントでも、インターフェースは応答性を保ちます。とはいえ50 MBのペアには、実際の処理として数十秒かかります。違いは、固まったタブを眺める代わりに、実行中でもスクロール、入力、キャンセルができることです。