Do you know what may cause memory leaks in JavaScript?

Question

Do you know what may cause memory leaks in JavaScript? I am interested in browsers: IE 7, FireFox 3, Safari 3

Answer 1

In what browser? Firefox 2? Firefox 3? IE6? IE7? Safari?

Each of them have a different version of the javascript engine. So each of them have their own bug.

Answer 2

In general; circular references are the cause of many problems. I remember IE 6 (not sure if it applies to 7) leaking quite badly with XMLHTTP... setting onreadystatechange = null once it was finished with fixed it.

Answer 3

How are you measuring the leak?

Answer 4

There is a nice article about JavaScript and memory leaks. It does not specific about on browser, it rather describes the whole problematic of memory leaks and JavaScript.

• JavaScript and memory leaks
• Introducing the closure
• More leakage patterns
• Conclusion

I think it is a better approach to be as browser unspecific as possible insted of optimizing for a few browsers, when developing a website for the public.

Answer 5

Here is a classic memory leak in IE:-

function body_onload()
{
    var elem = document.getElementById('someElementId');
    // do stuff with elem
    elem.onclick = function() {
        //Some code that doesn't need the elem variable
    }
 }

After this code has run there is circular reference because an element has a function assigned its onclick event which references a scope object which in turn holds a reference to element.

someElement->onclick->function-scope->elem->someElement

In IE DOM elements are COM based reference counting objects that the Javascript GC can't cleanup.

The addition of a final line in the above code would clean it up:-

var elem = null;

Answer 6

You can check this MSDN article for Internet Explorer memory leak patterns. Also there are some tools for detecting memory leaks:

• sIEve
• JavaScript memory leak detector
• Leak Monitor FireFox plugin

Answer 7

You're dealing with 2 kinds of objects (and 2 garbage collectors), javascript and DOM objects, which can reference each other (the circular reference), and then neither GC can take care of all its objects even when the page unloads. Here's a good description:

http://getben.com/archive/2006/05/30/Resolving-JavaScript-Memory-Leaks.aspx

http://www.josh-davis.org/2007/04/11/javascript-built-in-listeners-and-memory-leaks/