I have a slider to control volume. When there one or two accordions in a list below on the same page it renders fast and smooth when the slider is dragged, but as soon as I have a list of accordions below (rendered using react-virtuoso) that is much larger, it slows down awfully and the motion of the slider becomes very jerky.
I did notice that when I hover on the slider dot the whole page re-paints, but it also does this on the mui website too. But dragging the slider dot is simply awful.
I'm using react-redux to store the value of the slider and update the volume, but why would it be that the presence of many accordions would slow it down.
I'd add a code sandbox, but I'm having trouble getting it to load MUI nicely. If I get that working, I'll edit and add the link.
I also noted when looking at the performance monitor that the CPU usage appears to go up to 95% while moving the slider as seen by the spikes in this image:
