JSON Deep Diff: เปรียบเทียบ JSON สองชุดแบบลึก เห็นทุกค่าที่เปลี่ยน

เวลาทำงานกับ API, config file หรือ data snapshot สิ่งที่เกิดขึ้นบ่อยมากคือ "JSON สองชุดนี้มันต่างกันตรงไหน?" ถ้าใช้ text diff ธรรมดา คุณจะเห็นบรรทัดที่เปลี่ยน แต่ไม่เห็นภาพรวมว่า key ไหนถูกเพิ่ม key ไหนถูกลบ และค่าไหนเปลี่ยนจากอะไรเป็นอะไร ยิ่ง JSON มีโครงสร้างซ้อนลึกหลายชั้น การไล่ดูด้วยตายิ่งยากเข้าไปใหญ่

JSON Deep Diff คือเครื่องมือที่แก้ปัญหานี้โดยตรง มันเปรียบเทียบ JSON สองชุดแบบ recursive ลึกถึงทุกชั้นของโครงสร้าง แล้วจัดประเภททุกความแตกต่างเป็น added, removed หรือ changed พร้อมแสดง JSON Pointer path เต็มเส้น (เช่น /address/city) ให้คุณรู้ตำแหน่งที่แน่นอนของทุกการเปลี่ยนแปลง และทั้งหมดนี้ทำงานในเบราว์เซอร์ 100% — ข้อมูลของคุณไม่ถูกส่งไปไหน

ทำไมต้องใช้ JSON Deep Diff?

• เห็นภาพรวมทันที — แทนที่จะไล่ดู text diff ทีละบรรทัด คุณเห็นรายการความแตกต่างทั้งหมดจัดกลุ่มตามประเภท พร้อมตัวนับสรุป added / removed / changed / total
• JSON Pointer path เต็มเส้น — ทุกความแตกต่างมาพร้อม path ตามมาตรฐาน RFC 6901 เช่น /roles/2 หรือ /address/city บอกตำแหน่งที่แน่นอนในโครงสร้างซ้อนลึก
• ตรวจจับ type change — ถ้าค่าเปลี่ยนจาก string เป็น number หรือจาก object เป็น array เครื่องมือจะระบุ type change ให้เห็นชัดเจน ไม่ใช่แค่ค่าเปลี่ยน
• ทำงานในเบราว์เซอร์ 100% — ไม่มีการอัปโหลดข้อมูลไปยังเซิร์ฟเวอร์ เหมาะกับข้อมูลที่เป็นความลับ เช่น config production หรือ payload ของลูกค้า
• Swap ด้านการเปรียบเทียบได้ — กดปุ่ม Swap เพื่อสลับด้าน old/new ได้ทันที ไม่ต้อง copy-paste ใหม่
• Copy ผลลัพธ์เป็น JSON — copy รายการ diff ทีละรายการ หรือ Copy All เป็น JSON array เพื่อนำไปใช้ต่อในสคริปต์หรือรายงาน

ฟีเจอร์เด่น

• Deep diff ต่างจาก text diff — text diff เปรียบเทียบทีละบรรทัดของข้อความ แต่ deep diff เข้าใจโครงสร้าง JSON จริง มันรู้ว่า {"a":1,"b":2} กับ {"b":2,"a":1} คือข้อมูลเดียวกันแม้ลำดับ key ต่างกัน
• รองรับ array อย่างถูกต้อง — การเพิ่มหรือลบ element ใน array จะถูกระบุด้วย index ใน path เช่น /roles/2 ทำให้รู้ว่าตำแหน่งไหนใน array ที่เปลี่ยน
• type change แยกจาก value change — ถ้า age เปลี่ยนจาก 30 (number) เป็น "30" (string) เครื่องมือจะแสดงว่าเป็น type change ไม่ใช่แค่ค่าเปลี่ยน ซึ่งสำคัญมากเวลา debug API

วิธีใช้งาน

1. เปิดเครื่องมือ — ไปที่ JSON Deep Diff คุณจะเห็นช่อง input สองช่องสำหรับ JSON ชุดเก่าและชุดใหม่
2. วาง JSON ชุดเก่า — วาง JSON ชุดเดิม (old / before) ลงในช่องแรก หรือกดปุ่มโหลดตัวอย่างเพื่อทดลอง
3. วาง JSON ชุดใหม่ — วาง JSON ชุดที่แก้ไขแล้ว (new / after) ลงในช่องที่สอง
4. ดูผลลัพธ์ — เครื่องมือจะแสดงรายการความแตกต่างทั้งหมด จัดกลุ่มเป็น added / removed / changed พร้อม JSON Pointer path และตัวนับสรุป
5. Copy หรือ Swap — copy รายการที่สนใจทีละรายการ, กด Copy All เพื่อเอาทั้งหมดเป็น JSON array, หรือกด Swap เพื่อสลับด้านการเปรียบเทียบ

เข้าใจ JSON Pointer และการ Deep Diff

JSON Pointer (RFC 6901) คือมาตรฐานสำหรับระบุตำแหน่งของค่าภายในเอกสาร JSON ด้วย string path ที่ขึ้นต้นด้วย / และคั่นแต่ละชั้นด้วย / เช่น /address/city หมายถึง key city ที่อยู่ภายใน object address สำหรับ array จะใช้ index เป็นตัวเลข เช่น /roles/2 หมายถึง element ที่สาม (index เริ่มจาก 0) ของ array roles

การที่ JSON Deep Diff ใช้ JSON Pointer path ทำให้ผลลัพธ์ที่ได้สามารถนำไปใช้ต่อได้ทันทีกับเครื่องมืออื่นที่รองรับมาตรฐานเดียวกัน เช่น JSON Patch (RFC 6902) ที่ใช้ path รูปแบบเดียวกันในการระบุตำแหน่งที่ต้อง patch

Deep diff ต่างจาก text diff อย่างไร? text diff ทำงานกับข้อความทีละบรรทัด มันไม่เข้าใจว่า JSON คือโครงสร้างข้อมูล ดังนั้นถ้าคุณจัด format ใหม่ (pretty-print) หรือเรียง key ใหม่ text diff จะรายงานว่ามีการเปลี่ยนแปลงทั้งที่ข้อมูลเหมือนเดิม แต่ deep diff parse JSON เป็นโครงสร้างก่อน แล้วเปรียบเทียบค่าจริงในแต่ละตำแหน่ง ทำให้ไม่สนใจลำดับ key หรือการจัด format

Array และ type change เป็นสองกรณีที่ deep diff จัดการได้ดีเป็นพิเศษ สำหรับ array การเปรียบเทียบจะทำทีละ index ทำให้รู้ว่า element ไหนถูกเพิ่ม ลบ หรือเปลี่ยน ส่วน type change จะถูกระบุแยกต่างหาก เพราะการที่ค่าเปลี่ยนจาก 30 เป็น "30" อาจเป็น bug ที่ร้ายแรงในระบบที่คาดหวัง type เฉพาะ

Use Case ในทางปฏิบัติ

ทดสอบ regression ของ API response

เวลาคุณเปลี่ยนโค้ด backend แล้วอยากรู้ว่า response ของ API เปลี่ยนไปจากเดิมอย่างไร ให้ copy response ก่อนและหลังการเปลี่ยนมาวางใน JSON Deep Diff คุณจะเห็นทันทีว่า field ไหนถูกเพิ่ม ลบ หรือเปลี่ยนค่า และ field ไหนที่ type เปลี่ยน ซึ่งอาจทำให้ client พังได้

ตรวจจับ config drift

ในระบบที่มี config หลาย environment (dev, staging, production) การเปรียบเทียบ config สองชุดด้วย deep diff ช่วยให้เห็นว่าค่าไหนต่างกันบ้าง เช่น timeout ใน production เป็น 30000 แต่ใน staging เป็น 3000 หรือมี key featureFlag ที่เพิ่มเข้ามาเฉพาะ production

Debug การเปลี่ยนแปลง webhook payload

เวลา third-party ส่ง webhook payload มาแล้วพฤติกรรมเปลี่ยนไป ให้เปรียบเทียบ payload ก่อนและหลัง deep diff จะบอกคุณว่า field ไหนหายไป field ไหนเพิ่มเข้ามา หรือค่าไหนเปลี่ยน ซึ่งช่วย pinpoint สาเหตุได้เร็วกว่าการไล่ดู log

เปรียบเทียบ data snapshot ใน CI

ใน pipeline CI ที่มีการ snapshot ข้อมูล (เช่น ผลลัพธ์ของ transformation หรือ state ของระบบ) การใช้ deep diff เปรียบเทียบ snapshot ปัจจุบันกับ baseline ช่วยตรวจจับการเปลี่ยนแปลงที่ไม่คาดคิดได้อย่างแม่นยำ พร้อม path ที่บอกตำแหน่งที่แน่นอน

แนวปฏิบัติที่ดี

• จัด format JSON ให้ตรงกันก่อนเปรียบเทียบ — แม้ deep diff จะไม่สนใจการจัด format แต่การวาง JSON ที่ parse ได้ถูกต้องเป็นสิ่งจำเป็น ถ้า JSON ไม่ valid เครื่องมือจะแจ้ง error
• ใช้ JSON Pointer path ในรายงาน — เมื่อพบความแตกต่าง ให้อ้างอิงด้วย path เช่น /address/city แทนการบอกว่า "ตรง city เปลี่ยน" เพื่อให้สื่อสารได้ชัดเจน
• ระวัง type change — การเปลี่ยน type มักเป็น bug ที่ร้ายแรงกว่าการเปลี่ยนค่า ให้ตรวจสอบ type change ทุกครั้งก่อน deploy
• เปรียบเทียบเฉพาะส่วนที่สนใจ — ถ้า JSON มีขนาดใหญ่ ให้ตัดเฉพาะส่วนที่เกี่ยวข้องมาเปรียบเทียบ จะได้ผลลัพธ์ที่โฟกัสและอ่านง่าย
• เก็บผลลัพธ์เป็น JSON — ใช้ Copy All เพื่อเก็บรายการ diff เป็น JSON array สำหรับนำไปวิเคราะห์ต่อหรือแนบใน bug report
• ใช้ Swap เพื่อยืนยัน — หลังเปรียบเทียบแล้ว ลองกด Swap เพื่อสลับด้านและตรวจสอบว่าผลลัพธ์สอดคล้องกัน

เริ่มใช้งาน JSON Deep Diff เลย

ไม่ว่าคุณจะเป็น backend developer ที่ต้องตรวจสอบ API response, DevOps ที่ต้องตรวจจับ config drift, หรือ QA ที่ต้องเปรียบเทียบ data snapshot — JSON Deep Diff ช่วยให้คุณเห็นทุกความแตกต่างใน JSON ได้อย่างรวดเร็ว แม่นยำ และเป็นส่วนตัว เพราะทุกอย่างทำงานในเบราว์เซอร์ของคุณ

เครื่องมือที่เกี่ยวข้อง

• JSON Formatter — จัด format และ validate JSON ให้อ่านง่าย
• JSON Patch Generator — สร้าง RFC 6902 JSON Patch operations จากความแตกต่างของ JSON สองชุด
• JSON to YAML Converter — แปลง JSON เป็น YAML และกลับกัน

ขอให้สนุกกับการ diff!