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

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

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

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

如果想要读懂以上文章从而深入了解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没有完全解决内存泄漏问题，它解决了若干原则中违反第三条后造成的泄漏，但根据我的测试其他几项并没有解决。