Beginnings

There are many Gantt Chart Libraries out there, some good, some bad, many expensive. I came across https://github.com/MaTeMaTuK/gantt-task-react in several threads, and it was close to what I needed, but not quite perfect. I saw the potential, especially in how it rendered the Chart using SVGs, and decided I could add the necessary enhancements by forking the library.

Today marks the 1.0 milestone of my efforts, with the following key improvements:

• 🔧 Migrated from Microbundle to Vite for improved build performance
• ♿ Enhanced accessibility by switching to semantic table-based rendering
• 🎨 Added more custom styling options
• 🧩 Introduced generic types for extended task details
• 🛠️ Refactored components for cleaner, more modern React practices

Technical Challenges

Type and Table Extensibility

Introducing generic types was one of the biggest improvements to the library, it means that you can now extend the base Task type to add custom fields, metadata, and more without compromising on core functionality. Providing the flexible foundation to adapt to your project requirements was one of my first priorities.

Accessibility

One of the largest changes was the move from div-based to semantic-table rendering. By leveraging proper HTML table semantics we’ve made the library more screen-reader friendly and aligned with web accessibility standards.

Build System Evolution

Moving from microbundle to Vite 6, and later upgrading to React 19 was a key part of the changes made, it moved the entire tech stack to a more performant, efficient bundler, reducing unpacked size from 620kb to 115kb, down more than 1/5th while increasing functionality and making the developer experience overall better.

Learnings

I learnt a lot during the process, this was my first time using Vite Library Mode, publishing to NPM and contributing something back to the Open Source Community! I plan on continuing to work on the library as and when new ideas come up, and if you have any feel free to drop me a message 🙂

Go check out the library yourself and let me know if you use it in any cool projects: https://github.com/nikmaxott/gantt-task-react