Gantt chart loading takes too long (more than 1000 rows of data)

1.After binding to a grid of more than 10000 rows, the gantt chart stumbles with longer loading times.

  1. It takes a long time.
    As special When registering TASK in Gantt chart, set up to display time unit.

  2. The longer the TASK period is set, the more TASKs are set longer, the slower and more striking it becomes.

Is there a good workaround? How do you use this when processing large amounts of data?

  • Development environment: React JS

Hello Joonbin,
First, you need to make sure that you have the 6.2.x version as it has a lot of improvements. I tested that with that version, you can create 100 000 tasks with the 100-year scale and the day scale unit:
https://snippet.dhtmlx.com/1120eaa52

I didn’t test how it works with loading tasks from a file in React, but if I use the gantt.parse() command in the web console, everything works correctly.

If you have an older version, you can try adding the smart rendering extension and enabling the static background:
https://docs.dhtmlx.com/gantt/desktop__performance.html

If that doesn’t help you, please send me a ready demo project so that I can reproduce the issue locally.

Thank you for the answer.
The version I am currently using is 6.1.X.
Will upgrading to 6.2 improve?

Facing same issue, just for a project spanning over three years and having three tasks. Using version 5.2 and also using smart rendering with static background set to true. Any other suggestions that improve the loading time?

Hello,

The version I am currently using is 6.1.X.
Will upgrading to 6.2 improve?

Yes, the performance should be better in the 6.2 version.


Facing same issue, just for a project spanning over three years and having three tasks. Using version 5.2 and also using smart rendering with static background set to true. Any other suggestions that improve the loading time?

We have only the following tips to improve the performance improvements in older versions:
https://docs.dhtmlx.com/gantt/desktop__performance.html

@Alekhya_Oruganti, @joonbin.choi

If you’ll be updating to 6.2 (btw, you can always try the evaluation version first),
please be sure to check the migration guides
https://docs.dhtmlx.com/gantt/migrating.html#6162

The one important thing is to remove dhtmlxgantt_smart_rendering.js (if you use it) from the app once you update to 6.2.

The advanced smart rendering is already included in the core version of the component (dhtmxgantt.js) and is enabled by default. And the separate dhtmlxgantt_smart_rendering.js extension is left only in case of backward compatibility issues for some users.

Using this extension in v6.2 will switch gantt back to the old smart rendering mode you’ll have the similar performance as in older versions (and 6.2 should work way faster).
Thus, if you use the smart rendering extension - please be sure to remove it after the update.
gantt.config.smart_rendering config should stay true

Also, if you didn’t use static_background config because you needed to highlight certain cells and columns in the timeline area - you’ll be able to use both these features in 6.2. The static background will render cells which have custom css classes, and with static_background the gantt should work even faster.