anomaly-detection-dashboards-plugin icon indicating copy to clipboard operation
anomaly-detection-dashboards-plugin copied to clipboard

Investigate heatmap chart excessive remounting

Open ohltyler opened this issue 4 years ago • 0 comments

The heatmap chart component is getting fully remounted when selecting any change that triggers any parent functions to run (e.g., changing the filter will run a parent function to run a new query to get new results, etc). Preferably, it only gets mounted once, and the state can be minorly updated through custom hooks rather than a remount of the component.

There are a few different ways React may trigger a remount, including a different key param being passed (which isn't the case here since no key prop is specified), the parent element being remounted (confirmed this doesn't happen in the parent AnomaliesChart component), or the root elements have different types (see details here).

I suspect this third ways is the issue happening, but don't see anything obvious that could be causing this. The JSX used to generate the elements is static in regards to element types, and I don't see how any parent element that encapsulates the <AnomalyHeatmapChart> component could be changing when AnomaliesChart is re-rendered.

More details on the bug this has caused is described in the workflows in #91

ohltyler avatar Sep 15 '21 17:09 ohltyler