0

編集:関連する問題とバグに関する情報については、https ://bugs.chromium.org/p/chromium/issues/detail?id=707544 を参照してください。

今後この質問に答える必要はありませんが、参考のために質問を残しておいてください。

Element.getElementsByTagName は Chrome で HTMLCollection を返します。

呼び出し元または参照元の要素を GC が収集するのを防ぎます。

Detached DOM ツリーには何も見つかりませんでしたが、ノード数 (およびおそらくヒープ サイズ) が予期せず増加しました。

以下は、コードが提供されているページのボタンをクリックして、代わりに GC を強制 した結果を示しています。(メジャー GC/DOM GC の後にヒープ サイズは削除されますが、ノード カウントは削除されません)

開発ツールのパフォーマンス

最初の割り当てと強制 GC 後のメモリ情報。

Devtool メモリ

私の意見では、これらの 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>
4

1 に答える 1