[jQuery] Single page application and jQuery

[jQuery] Single page application and jQuery


First of all, hi, my name is Phaedra and i am a web developer in
Italy.
So, i'm working for a company that's developing a single-page
application, with an extensive use of jQuery and we this it's a very
good library, especially for the easy semantics.
Running some performance tests last week, we run some tests also with
sieve 0.08 because ie7 became very irresponsive after some minute of
work.
We realized that the problem was the amount of nodes that after
$.remove were not freed from memory by ie7. So we made some test like:
$("<div id='container'/>").appendTo("body");
and
var e = document.createElement("div");
e.setAttribute("id", "container");
document.body.appendChild(e);
Basically, the first one leak 3 nodes, the second none.
Another example is a simple clock app:
html:
<div id='clock'>time</div>
js:
function update() {
$("#clock").html(new Date());
}
window.setInterval(update, 500);
in this one, the leaked nodes growed to 2000 in less than 1 minute!
js:
function update() {
var e = document.getElementById("clock");
e.innerHTML = new Date();
}
this does not leak at all.
Other problems come also with ui dialogs, nodes grow up each time we
open a dialog, never freeing them from memory. Using a simple dialog
in pure js, the problem is resolved (except for some element with
events attached).
In ie8 the problem is moderate, but is always there.
So, i'm asking you what's wrong in my example? it's possible that
jquery is leaking in this way? no one developing single page
application have had the same problem?
The problem seems to be in the remove function, and also in the
structure methods of jQuery.
Thanks.