Chrome中的HTMLCollection內存泄漏
[英]HTMLCollection memory leak in Chrome
原文
2017-03-31 10:18:59
8
1
javascript/
google-chrome/
memory-leaks/
garbage-collection/
htmlcollection
問題描述
編輯：請參閱https://bugs.chromium.org/p/chromium/issues/detail?id=707544了解相關問題和有關該錯誤的信息。
從現在開始不必回答這個問題，但保留該問題以供參考。
Element.getElementsByTagName在Chrome中返回HTMLCollection。
它阻止GC收集由調用或引用的Element。
盡管在“分離的DOM”樹中找不到任何內容，但節點數（可能還有堆大小）意外增加。
以下演示了單擊下面提供代碼的頁面中的按鈕並交替 強制執行GC的結果 。 （在主要GC / DOM GC之后，堆大小會減小，但不計節點數）
並且先分配內存信息並強制GC。
在我看來，這些HTMLCollection可能充當緩存/占位符。 由於其父元素是一個臨時元素，因此即使刪除並收集了這些元素，HTMLCollection的不必要副本也會保留。
在Win10中的Chrome 57.0.2987.133和Chromium 59.0.3058.0上觀察到。
可復制的代碼：
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id="content"></div>
<input type="button" id="button">
<script type="application/javascript">
var button = document.getElementById('button');
button.addEventListener('click', function() {
var content = document.getElementById('content');
for (var i = 0; i < 2000; i++) {
var el = document.createElement("div");
//var no_leak = el.querySelectorAll('SPAN'); // NodeList
var leak = el.getElementsByTagName('SPAN'); // HTMLCollection
content.appendChild(el);
el.remove();
}
});
</script>
</body>
</html>
1 個解決方案
解決方案1
0 2017-03-31 19:55:11
嘗試使用分配時間表。 請參閱使用分配時間表識別JS堆內存泄漏 。 這是一種內存分配的實時可視化。
JavaScript中的內存泄漏（Chrome）
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.