In my current application we have a heavy chart and some other components on the page.
In the chart we have option to the user to change the timeperiod like 3months, 6months & 1 year etc.
So every time user changes a value in this drop down the chart gets re rendered with huge no of data points which takes sometime to re render the chart.
We are getting the data from the server quickly but just that rendering takes a lot of time.
During this time, the whole page is freezes and users are not able to click on any of the buttons. So is there any way to stop this kind of behavior where one component rendering affects other components?
Here is a similar scenario I have created on code sandbox. So once you click on the Load Heavy Component
, and then instantly click on the checkbox it does not work, 1/2 secs after it works. This is the exact problem I am facing.