Dale St. Marthe
메모리 패널은 JavaScript 객체의 메모리 분포를 확인하고, 메모리 누수를 발견 및 격리하고, 함수별 메모리 할당 내역을 확인하는 등의 작업을 할 수 있는 진단 도구를 제공합니다.
개요
메모리 패널을 사용하면 4가지 프로필 유형을 캡처할 수 있습니다. 이러한 프로필 유형은 다양한 관점에서 스냅샷을 보여주고 다양한 유용성을 제공합니다.
- 힙 스냅샷: 페이지의 JavaScript 객체 및 관련 DOM 노드 간의 메모리 분포를 보여줍니다.
- 타임라인의 할당 계측: 시간 경과에 따른 계측된 JavaScript 메모리 할당을 보여줍니다. 프로필이 기록되면 프로필 내에서 할당되어 기록 종료 시점까지 활성 상태인 객체를 확인하는 시간 간격을 선택할 수 있습니다. 이 프로필 유형을 사용하여 메모리 누수를 격리합니다.
- 할당 샘플링: 샘플링 방법을 사용하여 메모리 할당을 기록합니다. 이 프로필 유형의 경우 성능 오버헤드가 최소이며 장기 실행 작업에 사용될 수 있습니다. JavaScript 실행 스택별로 분석된 할당의 아주 가까운 근사치를 확인할 수 있습니다.
- 분리된 요소: JavaScript 참조에 의해 유지되는 객체를 표시합니다.
이러한 각 프로필을 실행할 JavaScript VM 인스턴스를 선택할 수 있습니다.
자세한 내용은 다음을 참고하세요.
메모리 패널 열기
추억 패널을 열려면 다음 단계를 따르세요.
- DevTools를 엽니다.
- 다음을 눌러 명령어 메뉴를 엽니다.
- macOS: Command+Shift+P
- Windows, Linux, ChromeOS: Control+Shift+P
memory를 입력하고 Show Memory를 선택한 다음 Enter 키를 누릅니다. DevTools 창 상단에 메모리 패널이 표시됩니다.
또는 다음과 같은 방법으로 Memory 패널을 열 수 있습니다.
- 상단의 작업 표시줄에서 패널 더보기를 클릭하고 드롭다운 목록에서 메모리를 선택합니다.
- 오른쪽 상단에서 옵션 더보기 > 도구 더보기 > 메모리를 선택합니다.