나는 "Aw, snap!" 특정 웹 페이지가로드 될 때 크롬 크래시가 발생합니다. 나는 그것을 일으키는 것이 무엇인지 알아 내고 정말로 힘든 시간을 보내고 자 최선을 다하고 있습니다.Google 크롬 개발자 도구 타임 라인 메모리보기에서 DOM 노드 카운트 란 무엇입니까?
Chrome 개발자 도구에는 메모리 탭이 있으며 카운터 그래프를 보면 DOM 노드 카운트 라인이 올라가고 떨어지고 계속 증가하는 것을 볼 수 있습니다.
document.getElementsByTagName("*").length
하고 있었던 것을 의미하는 것으로이 문제를 이해했다.
DOM 노드 수 그래프가 실제로 표시되는 것은 무엇입니까? 이렇게 계속 증가하면 그 가능성이 "앗, 스냅!"의 원인이 될 수 있습니까? 추락?
DOM 노드 수 그래프는 메모리에 아직 보관되어있는, 즉 아직 가비지 수집되지 않은 DOM 노드 수를 나타냅니다. 이것은 getElementsByTagName을 통해 얻은 요소와 일치 할 필요가 없습니다. 후자는 또한 문서 트리에 실제로 첨부 된 요소 만 가져옵니다. 아직 참조가있는 '오프라인'항목은 없습니다.
이 특별한 피라미드 성장으로 쉽게 벗어날 수있는 방법은 추가 DOM 노드 보트로드를 만드는 런 어웨이 타이머에 몇 가지 코드가 포함 된 Facebook API의 Like 위젯입니다.
아직 메모리에 보유 된 DOM 노드는이므로 분리 된 노드라고합니다. 즉, 페이지의 DOM 트리에 표시되지 않지만 일부 JavaScript 코드는 여전히 페이지를 참조합니다. Detached DOM 노드가 간단한 코드로 무엇인지, Chrome DevTools를 사용하여 DOM 노드를 감지하는 방법에 대해 설명하는이 google dev 도구 게시물을 읽어보십시오. https://developers.google.com/web/tools/chrome-devtools/memory-problems/
감사합니다. 내가 페이스 북 API로 설명한 것과 비슷한 것을하고 있다고 밝혀졌습니다. – Robodude
'메모리에 아직 저장되어있는 DOM 노드가 무엇을 의미하는지 설명해 주시겠습니까? 예를 들어 내 페이지에는 약 700 개의 DOM 노드가 있고 DOM 노드 수 그래프에는 ~ 5k가 표시됩니다. HTML이 빌드 될 때 생성되는 중간 DOM 노드가 있습니까? – snewcomer