Lazy Rendering 도입으로 10MB JSON 처리 시 프리징 제거 및 Privacy-first 설계 구현

I built a privacy-first JSON viewer for Chrome after I got tired of waiting

Connor LeeBo2026년 6월 8일4분intermediate

AI 요약

Context

기존 JSON viewer들의 과도한 권한 요청과 폐쇄적 소스코드 운영으로 인한 보안 신뢰도 하락 문제 발생. 특히 대용량 파일 처리 시 Synchronous DOM manipulation으로 인한 브라우저 프리징 현상이 주요 병목 지점으로 파악됨.

manifest 기반의 최소 권한 설계(activeTab, scripting, storage)를 통한 사용자 데이터 접근 원천 차단
모든 의존성 라이브러리를 Vendoring 처리하고 CDN import 및 remote script를 배제하여 Supply Chain Attack 방지
초기 전체 렌더링 대신 Top-level 구조만 우선 렌더링하고 하위 노드는 사용자 인터랙션 시 렌더링하는 Lazy Rendering 기법 적용
JSON을 단순 렌더링 대상이 아닌 탐색 가능한 Tree 구조로 정의하여 메모리 부하 및 DOM 조작 비용 최적화
Content-type 검증 로직을 선행하여 유효하지 않은 데이터에 대한 원본 뷰 보존 및 예외 처리 구현

실천 포인트

1. 권한 요청 범위를 기능 구현에 필요한 최소 단위로 제한했는가

2. 외부 라이브러리 의존성을 Vendoring 하여 런타임 시 외부 네트워크 요청을 제거했는가

3. 대용량 데이터 렌더링 시 DOM 조작 횟수를 줄이는 Lazy Rendering 또는 Virtual Scroll을 검토했는가

4. 데이터 파싱 실패 시 fallback 전략을 통해 사용자 경험을 보존하고 있는가

태그