Apexcharts.js: Problem performance

[LorenRodriguez]

I am working a one a project. I need to simulate the similar chart of 25000 datapoints found on the web: https://apexcharts.com/features/. I have managed to make the chart, but the performance is much lower with 25000 datapoints compared to the chast of the web. Is it possible to achieve that performance?

Thanks

[junedchhipa]

On the features page of ApexCharts - there are certain things which are turned off to increase performance.

1. Animation is disabled
2. Markers size is set to 0

If you have a similar configuration, please create a CodePen so I can look at the config of your chart and suggest some improvements if needed.

PS: SVG charts are generally slower if there are thousands of data-points. The goal of ApexCharts is not to render millions of data-points as that is not achievable with SVG elements easily. WebGL can help if you want to achieve good performance with a lot of data-points (WebGL is not supported in ApexCharts yet)

[LorenRodriguez]

I have disabled Animation and performance is good. Thanks.

[mestaritonttu]

Disabling animations when they give no benefit is for sure a good idea (I prefer never to use them), but I thought I would share what I found in an SVG.js issue: "3.0 version will have much better performance on animation" (3.0 was released in Dec 2018).

[junedchhipa]

@mestaritonttu Thanks for the suggestion. I wanted to upgrade to 3.0, but the final size of ApexCharts became much larger (increased by ~ around 20%) after I tried the upgrade.
Also, I have manually tweaked some code of svg.js to prevent bugs while integrating ApexCharts in various 3rd party libraries.

Nonetheless, I will keep track of SVG.js as that is the core library ApexCharts depends on, and in future, I will upgrade to the latest version after weighing pros and cons.

[MACscr]

What is a reasonable number of data points to use as a limit?

[leeoniya]

you may want to consider https://github.com/leeoniya/uPlot

[mestaritonttu]

you may want to consider https://github.com/leeoniya/uPlot

Nah, it uses Canvas instead of SVG, so I doubt users of ApexCharts would consider it.

[leeoniya]

for users who insist on SVG, then obviously not. but those looking to render 25,000 data points would be doing themselves a disservice by dismissing libs purely based on technology, since Canvas & WebGL is where the performance is.

anyways, never hurts to be aware of additional options :)