Circular references to DOM objects on an HTML page cause a memory leak

View products that this article applies to.

Symptoms

A memory leak occurs when you refresh an HTML page that uses Microsoft JScript code that contains circular references to objects in the Microsoft Internet Explorer Document Object Model (DOM).

↑ Back to the top

Cause

This memory leak occurs because DOM objects are non-JScript objects. DOM objects are not in the mark-and-sweep garbage collection scheme of JScript. Therefore, the circular reference between the DOM objects and the JScript handlers will not be broken until the browser completely tears down the page. This memory leak will end when the browser opens a new Web page or when the browser window is closed.

↑ Back to the top

Resolution

To resolve this problem, avoid circular references to Internet Explorer DOM objects in your Jscript code. To work around this problem in the sample code that is included in the "More information" section of this article, make the following change:

function hookup(element)
{
    element.attachEvent( "onmouseover", mouse);
}
function mouse () 
{
}

With this change, the mouse function is not a closure object that leads to a circular reference.

↑ Back to the top

Status

Microsoft has confirmed that this is a bug in the Microsoft products that are listed in the "Applies to" section.

↑ Back to the top

More information

Steps to reproduce the behavior

Paste the following code in Notepad, and then save the file as Test.htm:
<HTML> <HEAD> <script language="javascript"> function initpage() { window.setTimeout("window.location.reload()", 500, "javascript"); } </script> </HEAD> <body onload="initpage()" > <div class='menu' id='menu'></div> <script language='javascript'> hookup(document.getElementById('menu')); function hookup(element) { element.attachEvent( "onmouseover", mouse); function mouse () { } } </script> </body> </HTML>
In this code, the handler (the mouse function) is nested inside the attacher (the hookup function). This arrangement means that the handler is closed over the scope of the caller (this arrangement is named a "closure"). The handler maintains a reference to the variable element. In this case, the variable element is the div HTML element with the ID parameter that is set to menu. But the div element refers to the handler. This reference is a circular reference.
Open Test.htm in Internet Explorer.

Notice that the memory usage in Windows Task Manager continues to increase every time the page refreshes itself.

↑ Back to the top

References

For more information about Internet Explorer leak patterns, visit the following Microsoft Developer Network (MSDN) Web site:

http://msdn2.microsoft.com/en-us/library/Bb250448.aspx

↑ Back to the top

Properties

Retired KB Content Disclaimer

This article was written about products for which Microsoft no longer offers support. Therefore, this article is offered "as is" and will no longer be updated.

↑ Back to the top