Finally, the alternative fix for IE6's memory leak is available

Update:6/9/2008

One of my fellows, Chris Heilmann helped to post this page to AJAXIAN.com and had got a lot of comments and feedbacks, which I really appreciate it.

Before you start to read this page, I assume that you do have a IE6 browser available and test these cases your self like I always did.

Of course, you should know memory leak well enough so that you won't introduce any dump memory leaks bugs like my sample codes here and you do know to avoid that problem.

In case you find avoiding memory leak hard after you tried all the available methods, then you are ok to try the finally hack, which is not actually the finalized solution to avoid memory leak.

Intro

I've been reading some very interesting Chinese JavaScript blogs for a while, and this one does catch my eye.

In case you can't read that Chinese article, the bellow are the partially translated JavaScript codes.

Introduction of the finally statement

The finally statement defines a block of code that will always be run after the completion of the preceding try block. The finally block will always be run even when an error occurs and control is passed to a catch block. The finally block will be run immediately after any catch block. Finally is a reserved word and cannot be used for anything other than declaring a final error handler for a try block. Stephen Chapman

First, see how finally works.

Codes that introduces memory leak in IE6

Code that doesn't introduce memory leak in IE6

With the try...finally statement, we may get rid of the annoying memory leak problem on IE6

Note that I also need to use the IE's proprietary method CollectGarbage() to recycle the used memory from those removed elements.

In the function makeLinkWithoutMemoryLeak(), if you don't call the CollectGarbage() method, then the used memory may not be restored until the page is refreshed.

Test Script in action

  <button onclick="makeLinks(100,true)">
  Make 100 links with memory leak
  </button>

  <button onclick="makeLinks(100,false)">
  Make 100 links without memory leak
  </button>

So you may   Make 100 links with memory leak   or   Make 100 links without memory leak

Click here to reload the page and watch if the memory is released after the reload the page.

One more thing...

Douglas Crockford has a great article about memory leak in IE6 and he also provided a test case which has codes as follows:

You may test it against your IE6 and you shall notice that the memory usuage will go up as long as the test is running on IE6.

Fix for Douglas Crockford's case

Awesome, right?

Cheers :-D

Hedger Wang