文字 JSON Diff 對比 — 線上差異比較

文字與 JSON 差異對比的運作機制

在軟件開發、數據分析與日常文本編輯中，比對兩個版本的內容並找出其差異（Diff）是一項基礎且頻繁的操作。本工具提供並排比較功能，用於比對「原始內容」與「修改後」的輸入，並清晰標示出其中的變更。

比對系統會將變更細分為三種基本類型：

本工具提供「文字」與「JSON」兩種獨立的對比模式，以應對不同格式的數據結構。

在「文字」模式下，用戶可以根據需要調整「文字粒度」，選擇「按行」或「按詞」進行比對：

為了方便測試，工具提供了文字範例。原始文字內容為：

BroBroGo 工具在瀏覽器本機執行。
它們快速、私密、簡單。
適合需要快速檢查時使用。

修改後的文字內容為：

BroBroGo 工具在瀏覽器本機執行。
它們快速、私密、專注。
適合需要快速對比時使用。

比對系統會精確標示出「簡單」變更為「專注」，以及「檢查」變更為「對比」的細微差異。

當切換至「JSON」模式時，工具不僅僅進行字面比對，而是先解析並格式化 JSON 內容，再依據數據結構進行語意分析，並列出具體變更的結構路徑。

JSON 模式的比對遵循以下規則：

物件鍵值無關順序：在 JSON 物件中，鍵值對（Keys）是無序的。因此，如果僅僅是鍵值對的排列順序發生變化，而內容未變，工具不會將其視為語意上的變更。
陣列按位置比對：JSON 陣列（Arrays）是有序列表，因此陣列內容會嚴格按照索引位置進行逐一比對。

以內建的 JSON 範例為例，原始 JSON 為：

{
 "name": "BroBroGo",
 "plan": "free",
 "tools": ["json", "regex", "hash"],
 "private": true
}

修改後的 JSON 為：

{
 "name": "BroBroGo",
 "plan": "free",
 "tools": ["json", "regex", "diff"],
 "private": true,
 "updated": 2026
}

在此範例中，比對系統會識別出 tools 陣列中索引為 2 的值由 "hash" 修改為 "diff"，並偵測到新增了鍵值 "updated": 2026。

本工具在設計上完全基於客戶端運作。用戶輸入的所有文字和 JSON 數據，均直接在用戶的瀏覽器本機進行對比與運算，整個過程中數據不會上傳到 BroBroGo 伺服器。這種本機處理機制不僅提高了響應速度，也避免了敏感數據（如 API 響應、設定檔或個人資料）在網絡傳輸中洩露，保障了數據處理的私密性。

為了確保瀏覽器頁面在處理大量數據時仍能保持順暢，工具設有以下限制與保護機制：

字數限制：單側輸入（「原始內容」或「修改後」）的最大容量上限為 300,000 個字元。
超時保護：比對運算如果超過 2.5 秒仍未完成，系統會自動終止運算，以防止瀏覽器當掉。
異常提示：
- 若輸入內容過大，會顯示「輸入內容太大了，請換一組更小的內容對比。」。
- 若比對超時，會顯示「這次對比花太久了。請縮小輸入，或改用按行比較。」。
- 若結果因效能安全而受限，會顯示「結果已截斷顯示，以保持頁面順暢。」。
- 若 JSON 格式有誤，會分別提示「左側 JSON 無效：」或「右側 JSON 無效：」並附帶具體錯誤訊息。
- 若比對因其他原因失敗，則顯示「無法完成這次對比。」。

文字模式按行或按詞比較原文；JSON 模式會先解析並統一格式，再列出 $.user.email 這類欄位路徑的變更。

比較會在背景執行，超過 2.5 秒就會停止。意外貼上過大的內容也會被擋下，避免頁面卡住。

欄位層級變更會按 key 名稱比較，所以單純調整物件 key 順序不算語意變更。陣列會按位置比較。