IE8のメモリリーク（メモリが増え続ける）の原因と解決策_JavaScriptスキル

最近の開発中に、ページでスケジュールされた部分更新を使用した結果、IE6、7、Firefox ではすべて正常でしたが、IE8 では数時間後にブラウザがクラッシュし、メモリ オーバーフローが発生しました。不適切に書かれたコードによるメモリ リークだと思っていましたが、IE6 と 7 では正常でした。調査の結果、IE8 のバグであることが判明しました。

問題

IE8では、特定のDomノードの生成によって占有されていたメモリは解放されず、これらのノードを削除してもメモリは解放されません。

メモリ リークのノード タイプには、form、button、input、select、textarea、a、img、objec が含まれます

span、div、p、table など、他のほとんどのノード タイプはリークされません。

この問題は IE8 でのみ発生し、他のブラウザでは発生しません。

ユーザーが F5 キーを押すと、IE8 は最初に window.top をアンロードし、メモリを解放します。ページが iframe の場合、この iframe をアンロードしても何も起こりません。 window.topをアンロードした場合のみメモリが解放されるようです。

例

例 1

次のコードを実行すると、IE8 ではメモリ リークが発生します。

function leak1() { 
var node = document.getElementById("TO_AREA"); 
node.innerHTML = "<img />"; 
node.innerHTML = ""; 
node = null; 
} 

注:

* この例ではノードを追加するため、リークが発生します。

* ID「TO_AREA」のdivがあります。

* 念のため、ここにはクロージャや循環参照はありません。

例 2

次のコードは innerHTML を使用していませんが、それでもリークします

function leak2() { 
var node = document.getElementById("FROM_AREA").cloneNode(true); 
node.id = "NEW_AREA"; 
document.body.appendChild(node); 
document.body.removeChild(node); 
node = null; 
}

注:

* FROM_AREA はフォームの ID であり、ここにはクロージャや循環参照はありません。

例 3

これは最も単純で直接的な例です:

function leak4() { 
var node = document.createElement("IMG"); 
document.body.appendChild(node); 
document.body.removeChild(node); 
}

注:

※imgの代わりにspanを使用すれば漏れはありません。

これらの例では、IE8 でのみメモリ リークが発生します。私は、Windows XP、Windows Vista、Windows Server 2008、Windows Server 2008 R2、および Windows 7 の IE8 でテストし、IE8 でリークした IE7 互換モードと標準を使用しました。あらゆるケース。

テストページ

液漏れについて

メモリ サイズは時間の経過とともに増加しますが、これがブラウザのクラッシュを直接引き起こすわけではありません。ブラウザが使用するメモリには上限があるようで、DHTML が内部的に使用するメモリを制限しているようです。

メモリが上限に達すると、メモリ不足を示すダイアログ ボックスが表示されるなど、ブラウザが自動的に処理します。

私自身のテストの結果、IFrame にもこの問題があることがわかりました (IE8 では)

補足: iframe メモリ解放

Ext コア開発者の Jack の答えは、TabPanelItem は、タブが閉じられているときにそのタブにカスタマイズされた要素に対して特別な処理を行わないというものです。この部分の作業はコントロールの外で完了する必要があります。一方、関連情報によると、IE には iframe 要素のリサイクルにバグがあるため、通常の状況では、要素の src 属性値を「abort:blank」に変更し、DOM ツリーから手動で削除する必要があります。スクリプト内で変数を参照する変数を空白に設定し、CollectGarbage() を呼び出すことで、iframe が適切にリサイクルされないことによるメモリ リークを回避できます。

<script>
function clearRAM() {
var frame = document.getElementById("ifr_content");
frame.src = 'about:blank';
frame.contentWindow.document.write( '');//清空frame的内容
frame.contentWindow.document.clear();
frame.contentWindow.close(); //避免frame内存泄漏
if (navigator.userAgent.indexOf('MSIE') >= 0) {
if (CollectGarbage) {
CollectGarbage(); //IE 特有 释放内存
//删除原有标记
var tags = document.getElementById("ifrSet");
tags.removeChild(frame);
//添加frameset框架
var _frame = document.createElement('frame');
_frame.src = '';
_frame.name = 'content';
_frame.id = 'ifr_content';
tags.appendChild(_frame);
}
}
}
//主动释放 5秒一次
setInterval( function() {
if (navigator.userAgent.indexOf('MSIE') >= 0) {
if (CollectGarbage) {
//alert(1)
CollectGarbage(); //IE 特有 释放内存
}
}
}, 5000) 
</ script>