Rendering latency with a large number of components

This issue has been created since 2022-09-12.

Which @angular/* package(s) are the source of the bug?

common, core, platform-browser-dynamic, platform-browser, zone.js

Is this a regression?

No

Description

We are developing an Angular application using angular 12, we have the need to render a large number of components (more than 300 components) dynamically at one and the same time.
Knowing that we are using the ViewContainerRef.createComponent method to create the component and the ChangeDetectionStrategy.OnPush as the change detection strategy for the whole application (main page and components)
During the development phase (on Dev machine ), the rendering time of all components took from 1 to 2 seconds. but when we tested it on another machine (with lower characteristics ) the rendering time took from 6 to 8s which is unacceptable for the client's requirements.
Furthermore, we tried the same test with another product using ReactJS, in the same machine and with the same number of components ,the rendering time took only 1 second.

Could you please advice?

Dev machine :
OS : Windows 10 Enterprise
RAM : 16GB
CPU : Intel(R) Core(TM) i7-7700 CPU @3.60GHz
GPU: Intel(R) HD Graphics 630
DISK: SSD NVMe

Test machine :
OS : Windows server 2012
RAM : 16GB
CPU : Intel(R) Xeon(R) CPU E5-2620 @2.00 GHz
GPU: No GPU
DISK: HHD

Browsers :

  • Google chrome
  • FireFox

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

No response

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 12.2.6
Node: 16.13.0  
Package Manager: npm 8.1.3
OS: win32 x64

Anything else?

No response

JoostK wrote this answer on 2022-09-12

Could you please share a runnable reproduction that showcases this situation; it's otherwise unactionable to us as it's unclear where any bottlenecks may occur.

jessicajaniuk wrote this answer on 2022-09-21

Without a reproduction, this isn't actionable for us.

More Details About Repo
Owner Name angular
Repo Name angular
Full Name angular/angular
Language TypeScript
Created Date 2014-09-18
Updated Date 2022-09-30
Star Count 84080
Watcher Count 3064
Fork Count 22235
Issue Count 1197

YOU MAY BE INTERESTED

Issue Title Created Date Comment Count Updated Date
2nd render window navigation BUG 1 2022-09-09 2022-09-28
[Bug] Editor does not exit if an OSCInput operator is in the dashboard 1 2022-09-04 2022-09-28
[Enhancement] There redundant field in TSortNode. 0 2022-07-05 2022-08-07
Level 4 with one computer (Privileged Access Workstation) 6 2022-01-23 2022-09-19
Website: Typo on the new News page 1 2022-01-02 2022-08-24
Scrolling strange behavior 3 2022-01-07 2022-09-22
not an issue: some improvement to arabic language and translated the missing ones 1 2022-01-23 2022-07-14
Parse error: syntax error 1 2022-01-12 2022-07-19
habridge, Fibaro, RGBW2 -> On/Off/Set color 6 2020-12-30 2022-09-13
Add missing newlines to the end of some files. 4 2019-02-03 2022-07-28
Question: How to offset the start of a series? 2 2022-01-26 2022-08-27
Error loading data 4 2021-03-13 2022-01-16
I can't enterbrooms 1 2021-03-12 2022-01-04
loading data error 1 2021-03-09 2022-01-04
What is the task in the Leaderboard kata? 2 2021-11-15 2022-07-27
After this project is deployed to linux using java language, an error is reported 1 2022-07-20 2022-09-12
[Intel]: https://www.crowdstrike.com/blog/lemonduck-botnet-targets-docker-for-cryptomining-operations/ 0 2022-04-21 2022-08-26
Adding capture using pipewire crashes gnome-shell when Material-Shell is used 0 2021-11-07 2022-09-23
Displays a 404 image when using a Logitech MX Master 3 via Bluetooth 11 2020-09-30 2022-09-01
Does not unpin Microsoft edge and store from taskbar 2 2021-03-15 2022-09-16
If fullscreen with multisplit and focus is on lowest terminal, going to un-fullscreen F11 does not react. 7 2021-10-19 2022-08-26
[Question] How can we optimize the database 0 2022-02-15 2022-09-16
Move default branch from `master` to `main` 1 2021-11-04 2022-09-10
Cura 5.0 on ubuntu 22.04 doesn't allow to login to my account 5 2022-05-21 2022-09-16
`{report}` is archived?! 18 2022-02-19 2022-09-20
coqdep -modules 1 2021-11-05 2021-12-23
OneSignal Test issues 5 2022-07-11 2022-09-29
The origin property in PermissionScope cannot be set 3 2022-08-31 2022-09-22
Build ROS2 package that contains custom interfaces (msg, srv) 1 2021-11-23 2022-09-25
Space when looking at comments of YouTube video 3 2022-01-30 2022-09-23
UNABLE_TO_GET_ISSUER_CERT_LOCALLY when testing locally with SSL 2 2022-01-06 2022-09-05
Cleanup and visibility enhancement 5 2022-02-23 2022-09-03
scan failure: marketplace-operator-catalog-initialization-bundle-image 0 2021-01-19 2022-07-29
scan failure: marketplace-operator-metadata-linting 4 2021-01-19 2022-07-29
Can't download older .NET when a new .NET is released 3 2022-08-11 2022-09-21
saving context/session 4 2017-05-08 2022-09-07
acr purge might have bug in date time calculation 1 2020-03-24 2022-09-23
GCP - Error 404 Failed to retrieve IAM role definition 4 2022-09-06 2022-09-18
Logout on Sleep 0 2020-01-26 2021-12-05
GCC 10 compatibility issue 1 2020-01-22 2022-09-08
How to access context menu after right click on the file in the file explorer with selenium windows application driver 32 2021-08-27 2022-09-22
[Youtube] Download error is silent during subtitle download 13 2022-03-22 2022-09-22
ProSieben - HTTP Error on Audio Download 5 2022-03-22 2022-09-15
Site request: xala.cat 0 2022-03-22 2022-07-15
Write comments to a separate file (not info.json) 1 2022-03-22 2022-09-11
VH1 Extractor error 500 on certain urls 1 2022-03-23 2022-09-06
Don't Download Shorts when Downloading YouTube Channels/Playlists 12 2022-03-23 2022-08-20
HPA should use the limits instead of requests 4 2022-02-09 2022-08-22
TypeError: fastify.next is not a function 2 2021-10-14 2022-09-19
specification of the `foreach` statement (12.9.5) doesn't apply for `System.Span` 10 2022-07-18 2022-09-28