JSON 비교 도구
두 JSON 객체를 나란히 비교합니다. 자동 포맷, 키 정렬, 차이점 하이라이트.
사용 방법
- Paste your first JSON into the left panel
- Paste your second JSON into the right panel
- Click Compare — both sides are auto-formatted and sorted
- Differences are highlighted: red for removed lines, green for added lines
자주 묻는 질문
-
Does key order matter?
No. Both JSON objects are sorted by keys before comparing, so differences in key order are ignored.
-
Can I compare nested objects?
Yes. The diff works on the formatted text after sorting, so nested structures are fully compared.
-
What do the colors mean?
Red lines exist only in the left (original) input. Green lines exist only in the right (modified) input. Unchanged lines have no highlight.
-
Is my data sent to a server?
No. All processing happens entirely in your browser.
JSON 비교가 필요한 이유
두 JSON 파일이 어떻게 다른지 파악하는 작업은 개발 현장에서 매일 반복됩니다. 단순히 텍스트를 눈으로 비교하는 방법은 오류가 발생하기 쉽고, 특히 중첩이 깊거나 키가 많은 JSON에서는 작은 차이를 찾아내기 매우 어렵습니다.
주요 활용 사례
API 응답 변화 추적: 새 버전의 API 배포 후 이전 버전과 응답 구조가 어떻게 달라졌는지 확인할 때 필요합니다. 필드가 추가되거나 제거되면 클라이언트 코드에 영향을 줄 수 있으므로 빠르게 탐지해야 합니다.
설정 파일 비교: package.json, tsconfig.json 등 프로젝트 설정 파일의 버전 간 차이를 분석할 때 유용합니다.
데이터 마이그레이션 검증: 데이터베이스 마이그레이션이나 ETL 파이프라인을 통해 변환된 데이터가 예상과 일치하는지 샘플 레코드를 비교하여 검증할 때 사용합니다.
코드 리뷰: Pull Request에서 JSON 설정이나 스키마 파일이 변경되었을 때, JSON 전용 diff 도구를 사용하면 의미 있는 변경과 단순한 형식 변경을 구분할 수 있습니다.
텍스트 Diff의 한계
일반 텍스트 diff 도구(예: git diff)로 JSON을 비교하면 여러 문제가 발생합니다.
키 순서의 민감성: JSON 객체에서 키 순서는 의미가 없지만, 텍스트 diff는 순서가 달라지면 전혀 다른 파일로 취급합니다. 실제로 내용은 같은데 키 순서만 바뀐 경우 대량의 가짜 변경(false positive)이 발생합니다.
포맷팅 차이: 들여쓰기 2칸과 4칸, 또는 공백 유무의 차이가 있으면 텍스트 diff에서는 모든 줄이 변경된 것처럼 보입니다. 실제로는 데이터 내용은 동일하고 포맷만 달라진 경우입니다.
JSON Diff 도구의 동작 방식
이 도구는 텍스트 차이 대신 의미론적(semantic) 비교를 수행합니다. 두 JSON 모두 파싱한 후 키를 알파벳 순으로 정렬하여 표준화된 텍스트로 변환합니다. 이렇게 하면 키 순서나 포맷팅의 차이는 무시되고, 실제 데이터 값의 차이만 표시됩니다.
- 빨간 줄: 왼쪽(원본)에만 존재하는 내용 — 삭제된 항목
- 초록 줄: 오른쪽(수정본)에만 존재하는 내용 — 추가된 항목
- 흰 줄: 양쪽 모두에 동일하게 존재하는 내용
실전 팁
JSON diff를 더 효과적으로 사용하려면 비교 전 양쪽 JSON을 같은 들여쓰기로 포맷팅하는 것이 좋습니다. 또한 큰 JSON에서 특정 부분만 비교하고 싶다면 해당 섹션만 추출하여 비교하면 더 명확한 결과를 얻을 수 있습니다.