MaTeMaTuK / gantt-task-react

Gantt chart for React with Typescript
MIT License
896 stars 492 forks source link

Laggy Scroll behavior when there are a lot of tasks >70 #188

Open AlbajramiKevin opened 1 year ago

AlbajramiKevin commented 1 year ago

Currently getting a very buggy scoll (left to right) in the tasks area. I am displaying around 150 tasks though, might it be that it cannot handle that many?

   const [tasks, setTasks] = useState<Task[]>(
      generateTasksFromFindings(findings)
    );

    const handleExpanderClick = (task: Task) => {
      setTasks(tasks.map((t) => (t.id === task.id ? task : t)));
    };
    return (
      <Gantt
        viewMode={ViewMode.Month}
        tasks={tasks}
        onExpanderClick={handleExpanderClick}
        fontFamily="Roboto"
      />
    );
ivosturm commented 1 year ago

Hi @AlbajramiKevin ,

I have customized this chart extensively and also found this issue. Once I removed the ScrollX dependency in the first useEffect function (in setBarTasks) on the Gantt component, it improved significantly. I didn't get any unwanted side effects until now, so feel free to try.