[转]防止Javascript造成IE内存泄漏的若干原则

Love The Way You Lie 2022-08-26 03:57 125阅读 0赞

From http://blog.csdn.net/Lunatic\_Sun/archive/2008/03/20/2198812.aspx

本文首发于：[http://www.lunaticsun.com/article/iememoryleak-principals][http_www.lunaticsun.com_article_iememoryleak-principals]

最近 [hax提到了IE Memory Leak][hax_IE Memory Leak] ，后来又看到 [有人][Link 1] 把Douglas Crockford的 [JScript Memory Leaks][] 拿出来讨论，不知道是不是最近内存泄漏又火了。这玩意儿确实是偏向技术了点儿，设计人员在使用Javascript如果不了解IE内存泄漏的实质是很容易造成泄漏的。

需要推荐的关于IE内存泄漏的唯一大作是： [Understanding and Solving Internet Explorer Leak Patterns][] ，亦有 [中文翻译版本][Link 2] 。

如果想要读懂以上文章从而深入了解IE内存泄漏的原理，那么你首先要了解Javascript的以下方面：

*  scope chain
 *  closure
 *  reference type

恕我没有办法提供以上三项的教程，互联网上随意搜索一下都有很多。对于一个偏向设计的人员来说，我觉得深入了解IE内存泄漏没有很大必要，但是如果是开发人员就一定要掌握，设计人员可以尝试在使用Javascript中遵循以下若干原则：

*  不要将一个DOM对象和一个JS对象相互成为对方的属性
 *  将事件处理函数放在定义它的函数的外部
 *  不要在创建DOM对象时插入script
 *  总是先将新创建的DOM对象插入到文档后，在对其进行其他操作。

另外，关于Douglas Crockford的例子造成了严重内存泄漏的原因不仅仅在于他违反了以上第二条，将 `s` 的事件处理函数放在了定义 `s.onclick` 的函数之内，形成了闭包。

s.onclick = function (e) {           s.style.backgroundColor = 'red';           alert(n);   };

更重要的是，他在其后的代码中使用了

s.parentNode.removeChild(s);

这句也是造成严重泄漏的关键之一。它与DOM Insertion Order Leak Model的原理一致，并且加剧了闭包造成的内存泄漏。

最后，我想说的是IE8 beta1没有完全解决内存泄漏问题，它解决了若干原则中违反第三条后造成的泄漏，但根据我的测试其他几项并没有解决。

[http_www.lunaticsun.com_article_iememoryleak-principals]: http://www.lunaticsun.com/article/iememoryleak-principals
[hax_IE Memory Leak]: http://hax.javaeye.com/blog/166794
[Link 1]: http://hi.baidu.com/afcn007/blog/item/89603908dfddc1d562d9862e.html
[JScript Memory Leaks]: http://javascript.crockford.com/memory/leak.html
[Understanding and Solving Internet Explorer Leak Patterns]: http://msdn2.microsoft.com/en-us/library/bb250448.aspx
[Link 2]: http://birdshome.cnblogs.com/archive/2006/05/28/IE_MemoryLeak.html