エレメントに限りませんが、メモリ上に展開しているデータはどこからも参照できない状態になると始末されてメモリの空き容量が増えます。
document.body以下のDOMエレメントは「document.body.innerText = ''」とすることで画面上からは消え去りますが、innerTextを変更する前に「var elem=document.body.firstChild」などを実行していた場合は、innerText変更後でも「elem」変数の中には元のエレメントが存在します。つまり、メモリは解放されていません。
意図せず参照が残って解放されないものが溜まっていくとメモリ不足になってPCの動作がモタついてしまいますが、具体的にどのくらい消費してしまうのか確認しました。
「<div></div>」という、中身が何もない素のエレメント一個で大体200KBぐらい増えていました。意外と大きいです。
試験用ソース
試験結果
グラフ
参照を保持しているarrElemに[]を代入するタイミング(サイクル完了後5秒ぐらい)より前のタイミング(サイクル完了後3.2秒ぐらい)で78MBぐらい減っている理由は不明です。
100万個も参照を溜め込むと200MB弱もメモリを使用してしまいます……が、そんなに沢山のエレメントを扱うプログラムを作る機会があるのか不明です。
200MB / 100万個 = 約200KB
64bitOSを利用している場合は無視して良い場合もありそうですが、32bitOSで利用することが皆無ではない状況なら少し気を付けた方が良さそうです。
0 件のコメント:
コメントを投稿