search

Polymer / polymer

Our original Web Component library.
https://polymer-library.polymer-project.org/
BSD 3-Clause "New" or "Revised" License
22.05k stars 2.02k forks source link

Firefox memory usage in Angular +Polymer webcomponents application is huge in comparison to other browsers #5593

Open msbasanth opened 4 years ago

msbasanth commented 4 years ago

Hi,

Test Scenario: Angular page with 30 Dropdowns with 120 items each, 30 Tabs, 100 Checkboxes and 20 buttons.

Demos

Angular + HTML: https://github.com/msbasanth/AngularHtmlHeavyUIApp Angular + Polymer WebComponents: https://github.com/msbasanth/AngularPolymerHeavyUIApp

Angular + HTML Controls

Sl. No Browser Heap Memory Performance
1 Chrome 39.3MB 40s
2 Firefox with WebComponents 26.43MB 14.4s
3 Firefox without WebComponents 26.4MB 28.8s
4 Firefox 70 Beta 40.44MB 22.2 s
5 IE11 Unable to take snapshot 25s
6 Edge 27.78MB 15s
7 Edge Canary 38.1MB 11s

Angular + Polymer Components

Sl.No. Browser Heap Memory Performance
1 Chrome 32.8 MB 30s
2 Firefox with WebComponents 726.51MB 16.8s
3 Firefox without WebComponents 50.36MB 30s
4 Firefox 70 Beta 720.97MB 17s
5 IE11 Unable to take snapshot 2 Minutes
6 Edge 59.79MB 50s
7 Edge Canary 32.4MB 27.7s

Description

As you could see firefox memory usage is very high (726MB/276MB) compared to other browsers and IE11 initial load time is drastically high (2 Minutes)

Steps to Reproduce

  1. Launch an Angular application with 30 Dropdowns with 120 items each, 30 Tabs, 100 Checkboxes and 20 buttons.
  2. Check the performance using Chrome performance tab with Memory check enabled.
  3. Note down the initial load time and total memory usage by the application.
  4. There is very high memory usage in firefox with Polymer WebComponents enabled at the same time a performance degradation observed with IE11 (no webcomponents support, polyfills used)

    Expected Results

    We should have a comparable results across browsers when we use polymer webcomponents.

Actual Results

As you could see firefox memory usage is very high (726MB/276MB) compared to other browsers and IE11 initial load time is drastically high (2 Minutes)

Browsers Affected

Versions

Polymer v1.9.11 (Am I using the correct Polymer version?)

What could be the reason for huge memory usage in firefox and bad performance with IE11.

Regards Basanth

Pingger commented 3 years ago

Can confirm for firefox 80 using the provided Files from OP. And also on youtube (which is using polymer). Problem also seems to have gotten worse since FF 75...

stale[bot] commented 2 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

Pingger commented 2 years ago

not stale, devs just ignore it. stale bot is stupid