unexplainable DOM Node count increase in timeline

2,694 views
Skip to first unread message

marco.l...@gmail.com

unread,
Jul 23, 2013, 5:44:59 AM7/23/13
to google-chrome-...@googlegroups.com
Hi All,

I am investigating a DOM Node count in the timeline. I am executing an action which updates the innerHTML of a div. The current contents and the new contents are exactly the same so I am expecting that the DOM node count (after the garbage collect) before and after the action is equal.

However I see the DOM Node count increasing every time the innerHTML is updated. I have been fiddling with my code trying to determine what the reason of this increase is. I found out that changing an inline style, removing the 'overflow:hidden' fixes the increasing DOM Node count. When I don't remove the inline style but changes an IMG element to regular text this also fixes the DOM node count increase. So it seems it is a combination of overflow:hidden en the IMG element.

I cannot explain this, I won't expect changing an inline CSS or an element would be of impact on a DOM Node count on the timeline. How can I further investigate this ? Can it be a Chrome bug, or a bug of the Chrome developer tools timeline ? 

I am testing with Chrome 30.0.1572.0 canary

Regards,
Marco

Andrey Kosyakov

unread,
Jul 23, 2013, 5:50:16 AM7/23/13
to marco.l...@gmail.com, Google Chrome Developer Tools
Hi Marco,

is it possible for you to share the code that reproduces the problem?

Best regards,
Andrey.



--
You received this message because you are subscribed to the Google Groups "Google Chrome Developer Tools" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-chrome-develo...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

Yury Semikhatsky

unread,
Jul 23, 2013, 5:50:53 AM7/23/13
to marco.l...@gmail.com, Google Chrome Developer Tools
It sounds like a leak in Chrome. Can you take a heap snapshot and see if there are some JS retainers of the nodes that expeceted to be deleted? Can you share you sample with us? Also please make sure there are no extensions that could retain the nodes.


On Tue, Jul 23, 2013 at 1:44 PM, <marco.l...@gmail.com> wrote:

--

marco.l...@gmail.com

unread,
Jul 23, 2013, 5:55:56 AM7/23/13
to google-chrome-...@googlegroups.com, marco.l...@gmail.com, ca...@chromium.org
Hi Andrey,

I will try to make an isolated case, it is part of a large web application so it is hard to share it as it is (and probably more complex to debug for you ;-) )

Kind regards,
Marco

Op dinsdag 23 juli 2013 11:50:16 UTC+2 schreef Andrey Kosyakov het volgende:
To unsubscribe from this group and stop receiving emails from it, send an email to google-chrome-developer-tools+unsub...@googlegroups.com.

marco.l...@gmail.com

unread,
Jul 23, 2013, 5:59:34 AM7/23/13
to google-chrome-...@googlegroups.com, marco.l...@gmail.com
I couldn't find any retainers in the heap shots, I also couldn't find any (additional) detached DOM nodes in the summary view of the heap dump. I also wouldn't expect that changing the inline style would influence the retainers (but that expectation might be incorrect, I am just starting to dive into DOM leaks)

Best regards,
Marco

Op dinsdag 23 juli 2013 11:50:53 UTC+2 schreef Yury Semikhatsky het volgende:
To unsubscribe from this group and stop receiving emails from it, send an email to google-chrome-developer-tools+unsub...@googlegroups.com.

marco.l...@gmail.com

unread,
Jul 23, 2013, 8:37:52 AM7/23/13
to google-chrome-...@googlegroups.com, marco.l...@gmail.com, ca...@chromium.org
Hi Andrey,

I have found the root cause of the problem (I think). It is related to the image. In our web application we send a Cache-Control header with max-age of -1, to force the browser always to get the latest image as soon as it is available (responding with a 304 if it is not modified). If I remove this cache control header the leak disappears.

Also when the image does not exist (so a broken image icons is displayed) the leak is visible, so it looks like as soon as the browser needs to make a request for the image (because of the max-age or because it was not in cache because the image doesn't exists) this leaks nodes in the timeline node count.

I have made a jsfiddle example of the not-existing image case. http://jsfiddle.net/mlaponder/Fbwtm/8/. If you click on 'click' the inner html is shown, each click will update the same div with the same HTML so after the first click I wouldn't expect the number of nodes to increase, but when the image doesn't exists (or is not in cache bases on cache control headers) it will increase.

I have attached a screenshot of the timeline of the jsfiddle. Can you think of a workaround for this situation (except getting rid of the cache-control header) ? Should I report this as a bug ?

Regards,
Marco

Op dinsdag 23 juli 2013 11:55:56 UTC+2 schreef marco.l...@gmail.com het volgende:

jonatha...@gmail.com

unread,
Sep 10, 2013, 4:44:31 AM9/10/13
to google-chrome-...@googlegroups.com, marco.l...@gmail.com, ca...@chromium.org
Hi,

I've the same issue with a javascript that update the innerHTML of a div.

position: absolute  => DOM Node Count increasing
position: relative     => OK

I've tried to remove, empty... but nothing to do. 
I think that it's a chrome issue.

Marco Laponder

unread,
Sep 11, 2013, 1:51:40 AM9/11/13
to jonatha...@gmail.com, Google Chrome Developer Tools, Andrey Kosyakov
Hi Jonathan,

Never seen that situation before, although I am using position absolute often. Could you provide an example ? 

Regards,
Marco
Reply all
Reply to author
Forward
0 new messages