Currently the charts render empty/"No data to display" for a significant amount of time with large datasets. From a usability perspective, it would be best to have the app become responsive sooner, and have the charts slow that they are loading data.
Cursory invesgitation into this reveals that
We use a HOC (withAnswerDistributionCharts) to get the data for all charts from the DB in a single monolithic query
The recharts library has no "loading" state that we could use to show a spinner
Ideas:
Splitting into individual queries sounds like a good idea, but might not actually be more efficient. Much of the data for the charts depends on grouping by different variables. The data fetching cost is the significant part of the process - not the grouping.
It feels like perhaps the main data fetch could be cached on the backend, and subsequent 'groupby' operations could then be made into their own query without any penalty.
Rechart not having a loading state prevents us from implementing anything for now. Has another library emerged since we implemented this?
Currently the charts render empty/"No data to display" for a significant amount of time with large datasets. From a usability perspective, it would be best to have the app become responsive sooner, and have the charts slow that they are loading data.
Cursory invesgitation into this reveals that
withAnswerDistributionCharts
) to get the data for all charts from the DB in a single monolithic queryIdeas: