emanuelefricano93 / frxjs-Ngx-Timeline

NgxTimeline Angular Library
30 stars 10 forks source link

feat: add virtual scrolling #64

Open koga25 opened 1 month ago

koga25 commented 1 month ago

When needing to display very large quantities of items in the timeline this lib should not render it all at once, as this makes the application hang for very long periods of time. To remedy this, the developer should have the possibility of enabling virtual scrolling, making the application render very small quantities of the timeline at a time.

In a very small test, when running this lib as it currently is, with 10.000 items (enabling 1kk would hang my browser indefinitely), this was the result (11.13s for the first paint).

image

After enabling virtual scrolling, and using 1.000.000 items (a 100x increase), it cut down the time for the first paint by 4x.

image