Gantt Chart with React-Virtuoso

[AronAsmundsson]

Hello everyone,

I hope you’re all doing well! I’d like to discuss a challenge I’m facing with a custom Gantt chart implementation. Currently, the chart isn’t virtualized, and as our customers expand their datasets, I’m concerned about potential rendering issues. To address this, I’m exploring ways to implement virtualization.

Here’s the basic structure: I have two separate

elements—one for the table and another for the Gantt chart itself (see the attached image). When using standard divs without virtualization, I’ve successfully synchronized their Y-axis scroll using refs and functions.

However, after integrating the Virtuoso list component and attempting to sync the two lists, I’ve encountered significant lag. Despite my efforts, achieving smooth performance remains elusive.

I’d greatly appreciate any insights or ideas on how to more effectively share the scroll state between these two components. Your expertise would be invaluable!

Best regards, Aron

[AronAsmundsson]