No hate to MUI, it’s really good, but its LineChart is very heavy. I noticed this when ‘unhiding’ multiple of these charts. It would freeze the page for around 3 seconds until the charts appeared. If the charts were visible by default, it would prolong the initial page load by the same amount of time.
If I ever have to deal with plotting a lot of data I would probably use a library that uses the canvas component instead of the DOM directly.
I learnt about this the wrong way 💀.
To fix the freezing issue I did not fix the actual problem, which would’ve been changing libraries. I used the setTimeout function to progressively load the charts which is crazy. I overcomplicated things but well, it works I guess. Don’t do what I’ve done here. It makes things 5 times more complex.
I will learn the basics of the canvas component. I asked Gemini to create a script to draw and animate thousands of balls bouncing around and it did not lag at all. The canvas component seems very very powerful.
Leave a Reply