Object 라우트 뷰 모델
- 이전 → 이후
- 846 → 1451
- 차이
- +605
- 델타 / 반복
- +121
메모리 누수 찾기
화면 이동을 반복하고 시작 페이지로 돌아온 후에도 남아 있는 객체를 찾습니다. 브라우저에서 관측된 메모리 누적을 확인하세요.
보고서 조각
반복 간에 어떤 그룹이 증가하는지 확인
탐색 및 복귀의 예시입니다. 값은 보고서 설명용이며 사이트의 검사 결과가 아닙니다.
라우트 변경
/catalog → /product → /catalog × 5
탐색이 끝났지만 이전 페이지의 상태 객체가 메모리에 남아 반복할 때마다 늘어납니다. 어떤 참조가 객체를 유지하는지 확인하세요.
Set<observerTarget>
- 이전 → 이후
- 34 → 74
- 차이
- +40
- 델타 / 반복
- +8
네이티브 메모리
- 이전 → 이후
- 41.2 → 54.7 MB
- 차이
- +13.5 MB
- 델타 / 반복
- +2.7 MB
보고서를 설명하기 위한 예시 데이터입니다. 실제 페이지 결과는 검사 후 표시됩니다.
작동 방식
시나리오를 반복하고 패스 간 델타를 계산합니다
시나리오
페이지의 링크 선택
스캐너는 화면에 표시된 내부 링크를 최대 3개 찾습니다. 각 링크로 이동한 후 시작 페이지로 돌아오는 과정을 5회 반복합니다.
차이
메모리 사용량 비교
준비 실행 후 탐색을 반복해도 남는 메모리를 측정합니다. 첫 로드에서는 보이지 않는 누적을 확인할 수 있습니다.
증가 그룹
누적되는 항목 표시
보고서는 늘어나는 컬렉션, 이벤트 리스너, DOM 노드와 객체 유형을 보여줍니다. 정보가 있는 경우 컬렉션을 변경한 코드 위치도 표시합니다.
분석 모듈
메모리 누수 보고서에 포함되는 내용
시나리오
확인된 시나리오
보고서에는 URL, 확인된 사용자 경로, 반복 횟수, 누수 플래그가 저장되어 발견 사항을 재현할 수 있습니다.
누수URL반복
차이
총 메모리 증가
같은 탐색에서 총 증가량과 반복당 증가량을 비교하세요. 누적은 유지된 객체를 조사할 단서입니다. 의도된 캐시와 애플리케이션 상태도 메모리를 계속 사용할 수 있습니다.
총 델타반복당메모리 통계
컬렉션
Array, Map, Set, Object
증가하는 컬렉션은 별도로 나열됩니다: 변경 전후 크기, 델타, 반복당 델타, 컬렉션이 변경된 위치의 스택 트레이스.
MapObject스택 트레이스
리스너
이벤트 리스너와 노드
보고서에는 시나리오 전후의 리스너 수, 결과 델타, 구독이 증가하는 누수 리스너 노드가 표시됩니다.
전 / 후노드 델타반복당
DOM
DOM 노드 증가
보고서에는 DOM 노드 증가와 누수 노드 설명이 표시되어, 분리된 DOM이나 반복적인 인터페이스 초기화를 더 쉽게 찾을 수 있습니다.
노드 수설명분리됨
힙 객체
힙 객체 유형
증가하는 객체 유형에 대해 보고서에는 개수 델타, 크기 델타, 유지된 크기 델타, 반복당 값이 포함됩니다. 환경 데이터가 있으면 total, native, V8 힙이 별도로 표시됩니다.
개수 델타크기 델타유지됨
FAQ
메모리 누수에 관한 자주 묻는 질문
반복당 델타, 증가하는 컬렉션, 리스너, DOM 노드, 그리고 보고서 이후 해야 할 일에 대한 간단한 답변입니다.
메모리 증가는 모두 누수인가요?
아닙니다. 앱은 여전히 필요한 데이터를 보관할 수 있습니다. 스캐너는 반복 탐색에서 누적을 찾지만 앱에 어떤 데이터가 필요한지는 판단하지 못합니다. 무엇이 객체를 유지하며 돌아온 후 해제해야 하는지 확인하세요.
분리된 DOM 노드란 무엇인가요?
문서에서 제거됐지만 JavaScript 참조로 메모리에 남는 요소입니다. 예를 들어 닫힌 대화상자의 요소를 참조할 수 있습니다. 노드 설명으로 조사 범위를 좁히고 유지하는 참조는 코드에서 확인하세요.
검사가 이벤트 리스너 누수를 찾을 수 있나요?
예. 보고서는 전후 리스너 수, 총 델타, 반복당 델타, 그리고 노드 수 델타와 함께 누수 중인 리스너 노드를 보여줍니다. 이를 통해 일회성 구독과 매 반복마다 추가되는 핸들러를 구분할 수 있습니다.
어떤 페이지와 동작을 검사하나요?
전체 페이지를 다시 로드하지 않고 탐색하는 SPA를 대상으로 합니다. 스캐너는 표시된 내부 링크를 최대 3개 선택해 이동과 복귀를 반복합니다. 폼, 검색과 대화상자 열기는 따로 검사하지 않습니다. 적절한 링크가 없으면 검사가 실패하며, 이것이 누수가 없다는 뜻은 아닙니다.
누수를 발견한 후에는 무엇을 해야 하나요?
보고서에 나온 탐색을 반복하세요. 돌아올 때마다 리스너 수가 늘면 컴포넌트가 리스너를 추가하는 위치와 정리 작업이 실행되는지 확인하세요. leak 표시만 믿지 말고 객체를 유지하는 참조를 조사하세요. 수정 후 같은 경로와 반복 횟수로 비교하세요.
관련 서비스