search

infor-design / enterprise-wc

Enterprise-grade web component library for the Infor Design System
Apache License 2.0
27 stars 26 forks source link

IdsDatagrid: Headers with filters/icons are slow to render #2823

Open eaenriquez opened 6 days ago

eaenriquez commented 6 days ago

Describe the bug The current observations with the datagrid are:

  1. That having the filters/icons on the column headings are affecting the performance.
  2. Having many or few records doesnt affect the loading speed, we could load thousands of records fast, and with the same amount of records, loading it with filters/icons however is slow.

To Reproduce To replicate the issue, we need an environment where we can toggle the data and the columns. We did that in a replication project with M3 ExD. Please follow the setup and the steps to reproduce.

Setup:

  1. clone ssh://[git@oxfordssh.awsdev.infor.com]:7999/William.Hernebrink/exd-light.git
  2. run npm i -y
  3. run npx nx run m3:serve, then open localhost:4200 in Chrome browser
  4. click "Ids Datagrids" to show a page with a lot of datagrids

Steps to reproduce the behavior:

  1. To toggle the data, we have buttons on each datagrid to set/unset the data, To see the difference, toggle the data a few times without the filter columns, then toggle the data again with filter columns.
  2. To toggle the columns, with or without icons, we will need to comment/uncomment a line of code in the source. To do this, we can just edit this file libs > shared > ui > components > src > lib > ids-datagrid > ids-datagrid.component.ts. line 22 has no icons, line 23 has icons, just pick one to comment out and the other to render.

Expected behavior Having filters/icons on the column headings shouldn't be as slow when loading/unloading records

Version

Platform

tmcconechy commented 6 days ago

The filters have a lot of components in them. So putting a lot in there probably isnt going to be the fastest but maybe there are some tweaks we can do.