How to improve performance for stacked bar charts

[amory1989]

First: thanks to all the maintainers for this fantastic resource. I have a performance issue and would value your input:

I have a stacked bar chart that can have many hundreds of bars (which rely on thousands of dataSets - each 'box-and-whiskers' bar in the picture has 9 chartJs 'datasets'). When the chart just has ~7 or so stacked bars to display, things load with a tolerable lag (a couple seconds). When I have many hundreds of bars to display (and so many thousands of chartjs datasets), the page becomes unresponsive because chartjs takes too long. It does eventually load after a minute or two, but I need to dramatically improve the load time (obviously).

I've done a performance profile and discovered that most of the time is spent on getStacks, which is called by two functions: getStackCount and getStackIndex. These two functions are called for every single dataSet (thousands of times when I have thousands of dataSets). I've read that if I give the data to chartjs in its internal format and set the parsing option to false, that will improve performance. I already provide the data in what I think is the internal format (setting x and y attributes explicitly) -- but my chart doesn't load when I set parsing to false. I am guessing stacked bars either have a different 'internal format' that I can't find (if anyone knows where I can find documentation on this format, if it exists, I'd appreciate it!) -- or that there just isn't a way to set parsing to false with stacked bars.

I think I should be able to pass chartjs the stack index and the stack count at the outset, meaning I would just calculate these things once and chartjs won't have to calculate them on every single dataset. Is there a built-in way for me to set these attributes (can I set stackIndex in each dataset, and stackCount in chart options or something)? Many thanks in advance for any guidance you all might be able to provide!

Edit: A lot of time is also spent on getDatasetMeta

[Udemology]

Just a question for clarity. am I correct you created a custom plugin? If so perhaps this could help.

I have notice that beforeDatasetDraw functions is heavy in loading.
There is a beforeDatasetDraw() <-- this reloads for each and every datapoint. If you have thousands it would overload your chart.
There is another option which reduced the load by using beforeDatasetsDraw() <-- this does load multiple times but loads all datasets at once if I understand it correctly. Which is fewer compare to the upper option.

Maybe that might reduce your loading time.

And perhaps if this would be an option
There is a Plotbox Chart plugin for Chart.js. Perhaps this is more faster to use: https://youtu.be/2zEbeX0bPS8, and documentation: https://github.com/sgratzl/chartjs-chart-boxplot