Memory Timeline

[maxpr...@gmail.com]

Hello,

   I'm confused about a graph in  the timeline tool. As you can see in the attachement, the "DOM node count" and "Event Listener counts" are growing while the memory is still on about the same value. Seems like a leak but the memory is garbage collected and the level don't grow the same as DOM node and Event Listener increase, so what does it means ? 

  Another bonus question : what is "document count" ?

Many tks :)

[Ilya Tikhonovsky]

The page can create a big detached DOM tree and keep it in native memory by single javascript DOM wrapper object.

The graph shows only Javascript memory.

Your page can have many iframes with their own documents.

Regards,
Tim.

[maxpr...@gmail.com]

Hi IIya ! Can you explain me what you mean while you're talking about "detached DOM tree", "native memory". For the example, there's no iframe in the app.

Best Regards

[PhistucK]

Detached DOM tree is when you create DOM elements but not inserting them to the document (or, removing elements from the document but still keep references to them in non garbage collected variables).

var someElement = document.createElement("bla"); // A detached DOM tree.

someElement.appendChild(document.createElement("bli")); // Still a detached DOM tree.

document.body.appendChild(someElement); // No longer detached.

var someOtherElement = document.body.firstChild // Non detached DOM tree.

someOtherElement = someOtherElement.parentNode.removeChild(someOtherElement); // A detached DOM tree.

These variables are global variables for the sake of this example. Global variables are never garbage collected, I believe.

☆PhistucK

[maxpr...@gmail.com]

Hi Phistuck ! it's ok but why the upper memory graph don't grow to ?