When I try to render a large number (> 1000) of datasets using Chart.js, the page get stucked. So I did some test on this. Here is the performance report:
Test code can be found here:
https://github.com/helloint/Chart.js/blob/demo/dataset-performance-3.9.1/docs/samples/bar/stacked.md.
I also tried the performance guide here: https://www.chartjs.org/docs/latest/general/performance.html:
* `parsing: false`
* `normalized: true`
* `animations: false`
https://github.com/helloint/Chart.js/blob/demo/dataset-performance-3.9.1/docs/samples/bar/stacked-performance.md.
But no diff, same result.
I’m using v3.9.1
, so I also tried on the latest v4.4.2
:
https://github.com/helloint/Chart.js/blob/demo/dataset-performance-4.4.2/docs/samples/bar/stacked.md.
Still almost same time cost, even a bit worse. (Guess because of new features?)
Before I make conclusion that Chart.js is not designed to render such number of datasets, I hope to raise it here, see if any other opinions.
But I have to say it is not a good idea to render in this way, because every datasets become much smaller and hard to recognize. So the next step is I would like to try:
You should still consider decimating data yourself before passing it
Which is mentioned in the document.