You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I've added a dirty-check component to the project that can display the number of checks directly (I've copied this component from this repository of this code).
You can see that the change detection in version 7 is constantly running - in version 6 it's okay.
To double check, that this is not introduced by the dirty-check component itself, I disabled the dirty check-component (i.e. remove the <dirty-check> tag from the app.component.html template and instead check the change-detection in the angular dev-tools.
To do this:
in the new Windows press F12 to open chrome dev-tools
go to the Angular Tab
switch from the Components to the Profiler tab
click the start recording button (at the left-top)
in the ngx-echarts demo window, click the Get Data button and move the mouse over the chart
Now, the change-detection is not constantly running (so the dirty-check component has some effect on that) - but we can still see that version 7 causes a lot more changes than version 6.
Here's a profiler screenshot of version 6:
it shows 0/78 after clicking the Get Data button - moving the mouse over the chart or the button does not increase the count
in comparison: in version 7 clicking the the Get Data button increases the count by about 150 and it increases whenever we move the mouse
In this small example, the additional change detection does not make a difference, but in a larger app - and maybe on a smartphone - this has a severe impact.
Tested in Goolge Chrome Version 95.0.4638.54 (64-Bit)
I hope this info can help to improve performance in future versions (for now we stick with version 6).
The text was updated successfully, but these errors were encountered:
It seems that version 7 introduced some performance issues.
Here are 2 Stackblitz examples - both have Ivy enabled and use the same code, only the dependencies are different:
I've added a dirty-check component to the project that can display the number of checks directly (I've copied this component from this repository of this code).
You can see that the change detection in version 7 is constantly running - in version 6 it's okay.
To double check, that this is not introduced by the dirty-check component itself, I disabled the dirty check-component (i.e. remove the
<dirty-check>
tag from the app.component.html template and instead check the change-detection in the angular dev-tools.To do this:
Open in New Window
Components
to theProfiler
tabstart recording
button (at the left-top)Get Data
button and move the mouse over the chartNow, the change-detection is not constantly running (so the dirty-check component has some effect on that) - but we can still see that version 7 causes a lot more changes than version 6.
Here's a profiler screenshot of version 6:
Get Data
button - moving the mouse over the chart or the button does not increase the countGet Data
button increases the count by about 150 and it increases whenever we move the mouseIn this small example, the additional change detection does not make a difference, but in a larger app - and maybe on a smartphone - this has a severe impact.
Tested in Goolge Chrome Version 95.0.4638.54 (64-Bit)
I hope this info can help to improve performance in future versions (for now we stick with version 6).
The text was updated successfully, but these errors were encountered: