핵심 요약
우아한형제들이 JavaScript Proxy 기반 상태 추적 도구를 도입해 전자계약서의 상태 변화 흐름을 시간순으로 파악하고 디버깅 속도를 크게 높였습니다.
주요 경험
- Redux 없이도 상태 변화를 추적하기 위해 ProxyLogger를 도입했습니다.
- 기존 로직은 유지한 채, 감싸기 패턴(this.data = ProxyLogger(new 전자계약서()))로 변경 추적을 추가했습니다.
- Chrome DevTools 패널과 window.postMessage로 변화 로그를 시각화하고 개발자에게 즉시 전달했습니다.
얻은 인사이트
- 필드 간 의존성 없이도 원인을 빠르게 파악할 수 있어 디버깅 시간이 수 시간에서 수 초로 단축되었습니다.
- 도입 부담이 낮아 팀원 모두 쉽게 도구를 이해하고 활용할 수 있게 되었습니다.
- 라이브러리 의존 없이도 상태 추적성이 크게 향상되어 생산성이 높아졌습니다.
