페이지가 오래 켜져 있을수록 느려진다면
SPA(단일 페이지 애플리케이션)에서 흔히 겪는 문제 중 하나가 메모리 누수입니다. 컴포넌트가 사라져도 이벤트 리스너나 타이머, 구독(subscription)이 정리되지 않으면 참조가 계속 살아남아 메모리 사용량이 서서히 늘어납니다. 이 도구는 컴포넌트 수, 이벤트 리스너 수, 정리되지 않은 리스너 비율, 평균 세션 유지 시간을 입력하면 0~100점의 위험 점수로 누수 가능성을 가늠해 보여줍니다.
위험도 등급 기준
| 점수 구간 | 등급 |
|---|---|
| 70점 이상 | 높음 - 즉시 점검 필요 |
| 35~69점 | 보통 - 모니터링 필요 |
| 34점 이하 | 낮음 - 안정적 |
어디서부터 확인해야 할까
위험도가 높게 나왔다면 useEffect의 cleanup 함수, removeEventListener 호출, WebSocket·구독 해제 로직이 빠져 있는지부터 점검하세요. 특히 세션 유지 시간이 긴 대시보드나 실시간 페이지일수록 정리 로직의 누락이 치명적인 성능 저하로 이어질 수 있습니다.
자주 묻는 질문
메모리 누수 위험도는 어떻게 계산되나요?
컴포넌트 수, 이벤트 리스너 수, 정리되지 않은 리스너 비율, 평균 세션 유지 시간을 조합한 점수로 계산합니다.
이벤트 리스너를 정리하지 않으면 왜 위험한가요?
컴포넌트가 사라져도 리스너가 메모리에 남아 참조가 계속 유지되며, 세션이 길어질수록 메모리 사용량이 누적됩니다.
위험도가 높으면 무엇을 확인해야 하나요?
useEffect cleanup, removeEventListener, 구독 해제 로직이 빠져 있는지 우선 점검하는 것이 좋습니다.