Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Memory garbage collection #2452

Closed
ahedderich opened this issue Sep 18, 2015 · 11 comments
Closed

Memory garbage collection #2452

ahedderich opened this issue Sep 18, 2015 · 11 comments
Labels

Comments

@ahedderich
Copy link

While developing today i noticed that my Polymer powered page had an enormous hunger for memory after manually refreshing the tab several times.
I noticed the same behavior on https://www.polymer-project.org/summit (and all Poylmer sites i tested for that matter)
Both in vanilla Firefox and Chrome, after a few reloads, memory usage already exceeds 200Mb with open end, depending of the reload count. I pushed it over 500Mb and after 15 minutes idle tab, it didn't show any sign of reduction.
Same test with GitHub frontpage: While memory usage increases after a few moments the GC kicked in and reduced a lot.

Is there a special reason why this happens?

@ebidel
Copy link
Contributor

ebidel commented Sep 22, 2015

The summit sites embed the YouTube player, which tends to each memory and take up CPU cycles. Even if you're not viewing the homepage, the iframe is created an exists on the page. FWIW, I just brought up the site and did a couple of refreshes. The memory went up (expected) but the GC also kicked in after a few seconds.

If you have the devtools open when testing, this can also eat a LOT of memory. The more you refresh, the slow the page gets. At least, that's been my experience. Having DevTools open while testing is also known to low a page down :(

What sites have you been testing? I did another test on https://www.chromestatus.com/features (which is Polymer 1.0) and did see memory go up ~20mb/page reload but then got GC'd right after.

@leogr
Copy link

leogr commented Sep 23, 2015

I noticed the same behaviour. I made some tests using the latest version of Chrome both on Mac and Linux, with DevTools closed and observing the memory from Chrome's taskmanager

With https://elements.polymer-project.org, just reloading the page about 100 times the memory grows up to 1 GB (JS Memory ~650Mb live). Leaving the page opened for hours didn't show any sign of reduction.

Same issue with https://www.chromestatus.com/features and another polymer powered site I'm working on. I noticed this strange behaviour since two weeks while, maybe after the 1.1.x release (but I'm not sure about that and I didn't test with 1.0.x).
While developing it's very frustrating cause the tab crashes dozen of time a day :)

@ahedderich
Copy link
Author

On https://www.chromestatus.com/features
First request:
first

After a few more and navigation via top navigation:
after-a-while

Although the memory usage doesn't increase that much, the number of nodes starts on every new request with nearly its max value. This effect can also be observed while switching pages between "Features" and the "Metrics" pages on https://www.chromestatus.com/features
With a regular webpage like the google.com front page the count count keeps almost the same per reload.

If paper elements are used outside of a fully Polymer based environment, like in a wordpress theme for styling, the effect can also be observed while browsing the pages which amount to a significant memory usage.

@ahedderich
Copy link
Author

After a lot of testing, it seems the issue is related to certain elements only. If an paper-input element is attached to the dom for example.

@arthurevans
Copy link

This appears to reproduce in Firefox as well (measuring using about:memory), so I'm thinking Polymer. I've tried running the catalog with Polymer with versions back to 1.0.5 and the behavior appears the same. (I didn't try changing the polyfills or anything else, so there's always the possibility the issue is somewhere else).

@arthurevans arthurevans added the p1 label Sep 23, 2015
@ebidel
Copy link
Contributor

ebidel commented Sep 23, 2015

I'm afraid #2452 (comment) isn't a good test. The "Features" and "Metrics" pages are completely separate pages, with different resources, DOM elements, and even page structure. I'd expect the JS heap and Nodes to go way up navigating between the pages and keeping the timeline open. It's not a SPA. Namely, the metrics page also has lot of DOM nodes and custom elements.

However, refreshing https://www.chromestatus.com/features a few times, this is what I see in Chrome:

screen shot 2015-09-23 at 3 29 03 pm

@leogr
Copy link

leogr commented Sep 23, 2015

Gmail VS. https://www.chromestatus.com/features
(refreshing 5 times)

screen shot 2015-09-24 at 00 42 55

screen shot 2015-09-24 at 00 45 20

Note: I used Gmail just as example of a non-Polymer powered site.

@xharaken
Copy link

Maybe is this related to https://code.google.com/p/chromium/issues/detail?id=529941?

If you're using a CustomEvent, the bug may be related.

dfreedm added a commit that referenced this issue Sep 24, 2015
Holding on to an array of CustomEvents can leak memory across page refreshes in
Chrome: https://crbug.com/529941

Fixes #2452
@MartinMoizard
Copy link

@azakus Thanks, after a few tests, commit 76a5f17 seems to fix the issue.

@ahedderich
Copy link
Author

Yup. 76a5f17 works in my test cases.

@addyosmani
Copy link
Member

76a5f17 appears to address the issues noted here fine. Thanks @azakus!

MartinMoizard pushed a commit to MartinMoizard/polymer that referenced this issue Sep 30, 2015
Holding on to an array of CustomEvents can leak memory across page refreshes in
Chrome: https://crbug.com/529941

Fixes Polymer#2452
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

7 participants