最近不少同學(xué)提到IE的內(nèi)存泄漏問題，這個(gè)問題實(shí)際上在MSDN上的文章《Understanding and Solving Internet Explorer Leak Patterns》里已經(jīng)講過了，但我并不贊同里面的很多說法。這里我希望通過一些例子和圖片來演示一下這個(gè)現(xiàn)象。
首先是比較直觀的一類現(xiàn)象：pseudo leak。比如，反復(fù)重寫script對象的內(nèi)部文本：
<script type="text/javascript">
function leak()
{
for(i = 0; i < 300; i++)
{
document.getElementById("script").text = (new Array(100)).join((new Array(100)).join("function bigString(){};"));
}
alert("Complete!");
}
</script>
<script id="script">function foo(){};</script>
<a href="javascript:leak();">Start leak</a>
這樣會(huì)造成泄漏，但刷新或跳轉(zhuǎn)可以釋放內(nèi)存。下圖是內(nèi)存使用情況：
對此，MSDN上說：“You expect that after rewriting some script that the original script won't stay around. But it really has to, because it might have been used already for event attachments and there might be outstanding reference counts. As you can see, this is a pseudo-leak. On the surface the amount of memory consumption looks really bad, but there is a completely valid reason.”感覺比較荒唐。
不僅僅是重寫script對象存在問題，甚至重復(fù)創(chuàng)建局部變量也會(huì)有pseudo leak問題：
<script type="text/javascript">
function leak()
{
for(i = 0; i < 300; i++)
{
var bigString = (new Array(1000)).join((new Array(1000)).join("big string"));
}
alert("Complete!");
}
</script>
<a href="javascript:leak();">Start leak</a>
有一點(diǎn)泄漏的跡象，但不嚴(yán)重，刷新或跳轉(zhuǎn)之后恢復(fù)了正常：
比pseudo leak更嚴(yán)重的是actual leak。例如，用下面的方法反復(fù)創(chuàng)建的局部變量是一個(gè)DOM對象：
<script type="text/javascript">
function divClick(){}
function leak()
{
for(i = 0; i < 50000; i++)
{
var div = document.createElement("<div onclick='divClick();'></div>");//"<div onclick=''></div>" leads to the same result
}
alert("Complete!");
}
</script>
<a href="javascript:leak();">Start leak</a>
或者反復(fù)重寫一個(gè)全局變量：
var div;
function divClick(){}
function leak()
{
for(i = 0; i < 50000; i++)
{
div = document.createElement("<div onclick='divClick();'></div>");//"<div onclick=''></div>" leads to the same result
}
alert("Complete!");
}
甚至只是創(chuàng)建，完全不存在重寫：
for(i = 0; i < 500000; i++)
{
document.createElement("<div onclick='divClick();'></div>");// "<div onclick=''></div>" leads to the same result
}
這三種情況都將導(dǎo)致顯著的內(nèi)存泄漏，而且刷新和跳轉(zhuǎn)都不能解決問題。必須關(guān)閉IE：
這就不是pseudo leak了，而是actual leak。
網(wǎng)上一種廣為流傳的說法是“JavaScript中把變量設(shè)為null，JavaScript并不會(huì)把內(nèi)存釋放，當(dāng)下次再次定義變量時(shí)，就會(huì)覆蓋此變量所在的內(nèi)存。如果不設(shè)為null，JavaScript再次定義變量時(shí)，會(huì)開辟一個(gè)新的內(nèi)存空間。”但這也不對。比如將上面導(dǎo)致嚴(yán)重泄漏的代碼變個(gè)樣子：
function leak()
{
for(i = 0; i < 50000; i++)
{
var div = document.createElement("div");
div.onclick = function(){};
}
alert("Complete!");
}
這樣就不會(huì)泄漏。重復(fù)定義變量div并沒有開辟新的內(nèi)存空間。
這個(gè)問題屬于IE的缺陷，很難摸清規(guī)律，以后如果有新的發(fā)現(xiàn)，將會(huì)補(bǔ)充在這里。
本文中代碼的測試結(jié)果：
- IE 6：存在此問題，調(diào)用CollectGarbage()不能回收；
- IE 7：和IE 6相同；
- Firefox 2.0.0.8：正常（不支持document.createElement("<div onclick='divClick();'></div>")，只支持document.createElement("div")）；
- Opera 9.24：和Firefox相同；
- Safari 3.0.3：和Firefox相同。
