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

Performance issue with a large number of columns #11899

Open
Asbarn opened this issue May 8, 2024 · 1 comment
Open

Performance issue with a large number of columns #11899

Asbarn opened this issue May 8, 2024 · 1 comment
Labels
blocked blocked ticket

Comments

@Asbarn
Copy link

Asbarn commented May 8, 2024

BUG
There's a performance issue when using a lot of custom columns inside fdp-table component

Proposal:
Remove unused listeners and observers to free up the javascript thread. Right now there are too many subscriptions which can't be turned off if we don't need them.
Also even with virtualScroll enabled, rows are being re-rendered even if they are not visible:
note in the example that translate pipe is being triggered = page number * page size, when with virtual scroll it should be triggered just page size times. So when we scroll down 5-10 pages the table gets reloaded fully and page just freezes or takes >1 minute to refresh
Also please take a second look at how you use "will-change" property: IMO you use it too much and it not only does not optimise table but slows it down

Can you handle that on the application side

We tried to switch to DataProvider and use virtual scroll but it only improved our performance slightly
We tried to switch to signals and also use deferrable views but it didn't help

Which versions of Angular and Fundamental Library for Angular are affected? Please, specify the exact version. (If this is a feature request, use current version.)

Angular: >17.1
Fundamental: >0.49.2

If this is a bug, please provide steps for reproducing it; the exact components you are using;

This bug is reproducible if you have a lot of columns and if you have custom columns, pipes and additional customisations in SCSS and HTML

Stackblitz example containing some of the source code:
https://stackblitz.com/edit/wza6e3

In case this is Accessibility related topic, did you consult with an accessibility expert? If not, please do so and share their recommendations.

Did you check the documentation and the API?

We checked the source code. Proposal provided above

Did you search for similar issues?

Yes, similar issues have been reported before but no solution has been provided

Is there anything else we should know?

I implemented the same table using core fd-table and it works much better. It still freezes on >5-10 page as it re-renders the whole table because it does not virtual scroll but it still works better than platform's version of table

IMPORTANT NOTE:
Removing the check for innerText drastically improved the performance for us:
Bild
Can we do something about this line?

IMPORTANT: Please refrain from providing links or screenshots of SAP's internal information, as this project is open-source, and its contents are accessible to anyone.

@droshev droshev added the blocked blocked ticket label May 23, 2024
@droshev
Copy link
Contributor

droshev commented May 23, 2024

We are working a new virtual scroll with #11443. Once it is done, we shall analyze this scenario. @Asbarn thanks for reporting the issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
blocked blocked ticket
Projects
None yet
Development

No branches or pull requests

2 participants