JSON 로그 보다가 눈 빠질 뻔한 썰 (feat. FracturedJson)

안녕하세요. 풀링포레스트 테크리드 김영태입니다.

개발자라면 누구나 한 번쯤 "JSON 지옥"을 경험해 보셨을 겁니다. 특히 백엔드 개발을 하다 보면 API 응답값이나 서버 로그, 혹은 인프라 설정 파일까지 전부 JSON으로 되어 있는 경우가 태반이죠. 솔직히 고백하자면, 저는 얼마 전 레거시 시스템의 설정 파일을 열었다가 깊은 한숨을 내쉬었습니다. 좌표 데이터가 포함된 설정 파일이었는데, 일반적인 IDE의 포맷팅 기능을 돌렸더니 300줄짜리 파일이 순식간에 5,000줄로 늘어나는 기적(?)을 보았기 때문입니다.

스크롤을 아무리 내려도 끝이 보이지 않는 [, {, 숫자 하나, }, ]의 향연. 마우스 휠을 돌리다가 검지 손가락 관절이 아파올 지경이었습니다. "이걸 사람이 읽으라고 만든 건가?"라는 생각이 절로 들더군요.

우리는 흔히 두 가지 선택지 앞에 놓입니다. 공백을 전부 없애버린 Minified JSON은 기계에게는 친절하지만 사람이 읽을 수 없고, 들여쓰기가 적용된 Beautified JSON은 가독성은 좋지만 화면 낭비가 너무 심합니다. 특히 [1, 2, 3, 4, ...] 같은 간단한 숫자 배열조차 한 줄에 하나씩 출력해버리면 전체 구조를 파악하기가 불가능해집니다.

오늘 소개할 도구는 바로 이 답답함을 해결해 준 FracturedJson입니다.

이 도구를 처음 접했을 때, 저는 무릎을 탁 쳤습니다. FracturedJson은 단순히 들여쓰기만 하는 것이 아니라, 데이터의 구조와 길이에 따라 "스마트하게" 포맷팅을 해줍니다.

가장 큰 특징은 가독성을 해치지 않는 선에서 한 줄로 합쳐준다는 점입니다. 예를 들어, 짧은 배열이나 객체는 굳이 여러 줄로 나누지 않고 한 줄에 표현합니다. 하지만 더 놀라운 건 테이블 정렬(Table-like alignment) 기능입니다.

보통 배열 안에 비슷한 구조의 객체가 여러 개 들어있으면, 일반적인 포맷터는 그냥 줄바꿈만 합니다. 하지만 FracturedJson은 마치 엑셀 표를 보듯이 키와 값을 정렬해줍니다. 백문이 불여일견이니, 제가 겪었던 상황을 재구성한 예시를 보여드리겠습니다.

보시다시피 일반 포맷터가 좌표값 하나하나를 줄바꿈하여 수십 줄을 차지할 때, FracturedJson은 아래와 같이 직관적으로 바꿔줍니다.

"Locations": [
    [11, 2], [11, 3], [11, 4], [11, 5], 
    [1, 14], [1, 13], [1, 12], [1, 11]
]

또한, 객체 리스트의 경우 필드끼리 줄을 맞춰주기 때문에 눈으로 훑어보기가 정말 편합니다. 특정 필드 값만 쭉 훑어보고 싶을 때가 많은데, 이때 위력을 발휘합니다.

"SimilarObjects": [
    { "type": "turret",    "hp": 400, "flags": "S"   },
    { "type": "assassin",  "hp": 80,  "flags": "Q"   },
    { "type": "berserker", "hp": 150                 },
    { "type": "pittrap",              "flags": "S,I" }
]

어떤가요? hp가 얼마인지, flags가 무엇인지 한눈에 들어오지 않나요? 이전에는 이걸 확인하려면 눈동자를 지그재그로 움직이며 키 값을 찾아헤매야 했습니다.

또 하나 실무에서 유용한 점은 주석(Comment) 보존 기능입니다. 엄밀히 말해 표준 JSON 규격에서 주석은 허용되지 않지만, VS Code 설정 파일이나 jsonc 형식을 다룰 때는 주석이 필수적입니다. 대부분의 포맷터가 포맷팅 과정에서 주석을 날려버리거나 위치를 엉망으로 만드는 반면, 이 도구는 주석을 관련 요소 옆에 예쁘게 붙여줍니다.

저는 현재 VS Code 확장 프로그램으로 설치해서 사용하고 있습니다. 동료들이 "형, 그 JSON 파일 어떻게 그렇게 깔끔하게 정리했어요?"라고 물어볼 때마다 조용히 이 확장을 추천해주곤 합니다. 물론 .NET 라이브러리나 JS 패키지로도 제공되니, 사내 어드민 페이지에서 JSON 데이터를 보여줘야 할 때 라이브러리로 적용해 보는 것도 좋은 방법입니다.

개발자의 시간은 소중합니다. 스크롤 내리는 시간에 커피 한 모금이라도 더 마시는 게 이득이죠. 여러분도 무의미한 스크롤 노동에서 해방되어, 좀 더 쾌적한 "로그 탐험"을 하시길 바랍니다.

오늘도 묵묵히 코드를 짜고 계신 모든 개발자분들, 화이팅입니다.