Remove large series models from reactive data in Plots

[scottbell]

Summary

Plot configurations, highlights, and annotations have series models in them, and are reactive all the way down. We should instead being passing around series IDs instead of the full series model, and then have the individual components look up the series models internally. The trick here is they’ll need to then follow updates to add/removals of both series, and in the case of stacked plots, adding/removal of telemetry from the composition. I think this logic would be common to Legend components, MctPlot, and MctChart, and could exist in a separate helper class. The helper class could also return a series given an ID, which is what all these components want in the first place.

[scottbell]

With legends, was able to get a 6x speedup by removing series from highlights object. Before:

After:

[akhenry]

This must have been an issue pre Vue3 as well, no? Does it improve steady state rendering of plots as well?

[scottbell]

This must have been an issue pre Vue3 as well, no? Does it improve steady state rendering of plots as well?

Steady state looks about the same (surprisingly to me). It's anything interactive (zoom/rectangles/highlighting points) that drags the performance down with traversals of the big reactive objects.

[akhenry]

Got it, thanks, this helps me to prioritize the fix.

[scottbell]

To test:

• Create a high rate Sine Wave Generator (3Hz)
• Move mouse around and look at legend, should be much faster than previous incarnations.
• Create some annotations in real time mode and move mouse around. Should feel a lot faster.

[scottbell]

Before (note long mouseover time and annotation draw):

After:

[ozyx]

Verified Testathon 9/12/23 -- Plots are much more responsive, with or without annotations

[rukmini-bose]

Verified Testathon 9/12/2023