Memory Leak with InnerHTML

[m0nkeymafia]

I have spent the past few weeks trying to figure a way around this
problem, and have yet to find a good enough solution.

Internet Explorer leaks memory when I update a div container using
innerHTML, this does not occur in firefox. This would not be a problem
except the webpage is required to be left on for weeks on end without
being restarted. I presume the issue with innerHTML is that Internet
Explorer apparently parses what you give it and then decides on how to
construct the dom elements itself, so never truely creates what you
give it.

I know that the innerHTML is the problem as I have successfully
narrowed down the leak to that line. It only leaks memory when I assign
content to the innerHTML of my containing DIV. Appending a text node,
for example, with the exact same information to the same div does not
leak. Note I have also tried using such existing AJAX packages like
Prototype etc. but to no avail.

I need to do it this way as my XML documents are styled using an XSL
stylesheet and then transformed using transformNode [I will omit
details regarding firefox as there is no problem there]. I have looked
into transformNodeToObject as a way to get a dom object that I
originally assumed could be appended [as a child] to my containing
element. This did not work and gave me compatibility errors.

I suppose I am either looking for someone who has solved this problem,
or who has an acceptable work around. Or someone to say that it cannot
be solved.

I thank anyone in advance who attempts to help me. If you can help me
it would be GREATLY appreciated.

Below is a snippet of the final code I am using.

document.getElementById(container) = null;

output = http.responseXML.transformNode(xslProc);
if (output)
{
document.getElementById(container).innerHTML = output;
}
output = null;

[Matt Kruse]

m0nkeymafia wrote:

Internet Explorer leaks memory when I update a div container using
innerHTML, this does not occur in firefox.

The vital piece of information that you left out in your post is the actual
html that you are inserting into the div.
The act of inserting html does not cause a memory leak by itself (that I
know of). The leak is most likely coming from the specific html that you are
inserting, or the way that you are using your ajax call (making a closure
without realizing it and leaking dom nodes).

Further, you're using xml/xsl which may cause other problems.

I suggest you take your leaking page and keep trimming away as much as
possible from it until you have a bare-bones test case that still leaks. At
that point, you can isolate the real problem - whether it's the html being
inserted, closures from ajax, xsl, etc. Once you have an extremely simple
test case that leaks, post it here if you haven't figured out the cause yet.

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

[m0nkeymafia]

Thanks for the reply Matt, the code im inserting shouldn't cause
closures as it is pure HTML.
I didnt think that purely inserting HTML [with no reference to other
objects or any JS events] could cause a problem.

It is basically a couple of DIVs with some table elements inside, all
conform to strict xml standards.

Also what problems could arise from using xml/xsl transforms? I use one
XMLHttpObject rather than creating many in an attempt to stop memory
leaks, I also hold the XSL stylesheet in memory rather than
re-requesting it every time.

I will try cut down my style sheet so the XML it outputs is very basic,
it looks like I have been looking for problems in the javascript rather
than possible issues with my HTML output from the stylesheet.

Thanks again, I will be in touch.