Memory Growth and JavaScript Increasingly Slower in Internet Explorer

[Francisco Diaz Trepat - gmail]

Hi All.

I am trouble by Internet Explorer's inability to work properly as I use the
wicket web application we are building.

It is an ajax application and I found many references on the internet about
circular reference and memory leaks and how to solve them.

Almost all came down the the same function structure. a purge function that
detaches events from elements that are being removed.

This function was called on unload event in the samples from the web, but as
we don't have that event available (all-ajax) we replaced the wicket
replaceOuterHtml function.

This DOES NOT work at all. IE keeps allocating resources and surpasses 120
130 mb.

Can someone help us?

Here is the code that we use:

/**
 * Decorates the Wicket's replaceOuterHtml in order to add some memory clean
up attempts.
 */
function enhanceWicketAjaxReplaceOuterHtml() {
   var originalReplaceOuterHtml = Wicket.replaceOuterHtml;
   Wicket.replaceOuterHtml = function(element, text) {
      // purge element before removing
      // it must be done BEFORE in order to work properly in IE
      // if done after, the element no longer has its childNodes attached,
and then the purge is not done for the child nodes.
      purge(element);
      // call the original function
      originalReplaceOuterHtml(element, text);
   }
}

Here is the purge JS function:

/**
 * Attempts to break circular references, which are the cause of memory
leaks.
 * It sets the references to functions in DOM elements to null, then
theoretically breaking the circular reference.
 * It is not sure if this works or not (decrease of memory leaks could not
be verified in browsers),
 * and this could even be adding trouble by making lot of javascript
processing.
 * The trick is suggested in an article in
http://javascript.crockford.com/memory/leak.html,
 * and has some IE specific enhancements (calling detachEvent) that give
some hope for effectiveness.
 */
function purge(element) {
   var attributes, childNodes, index, length, name;

   attributes = element.attributes;
   if (attributes) {
      length = attributes.length;
      for (index = 0; index < length; index += 1) {
         if (attributes[index] == null) {
            continue;
         }

         name = attributes[index].name;

         if (typeof element[name] === 'function') {
            // Verify if is an onload onclick onblah
            if (Wicket.Browser.isIE()) {
               if (name.substring(0, 2) == 'on') {
                  element.detachEvent(name, element[name]);
               }
            }

            element[name] = null;
         }
      }
   }

   childNodes = element.childNodes;
   if (childNodes) {
      length = childNodes.length;
      for (index = 0; index < length; index += 1) {
         purge(childNodes[index]);
      }
   }
}