Skip to content

Draft: move attribute subscription to widget level.

Johan Forsberg requested to merge dashboard-performance into develop

Description

Note: this is a quick experiment, not a finished MR! Discussion is very welcome.

An attempt to solve the dashboard rendering performance problems. It works by separating websocket subscriptions (still done once, for the whole dashboard) and individual attribute callbacks (done for each widget). The point is that when an event arrives, we only need to inform the widgets that are interested in the particular attribute, not redraw everything.

This is very simplistic, and so far just an attempt to prove that the idea works, on a single widget (AttributeDisplay). Value formatting is ignored, as well as probably other important things. This change would require updating all the widgets to set up their subscriptions. Further, the attribute history would need to change, maybe it should be handled by the individual widgets that want it.

We still need to experiment a bit to find out if there are better ways to do this.

Also we should of course test this code on some complex dashboards, to check that it really helps. I am pretty sure it does reduce the re-rendering, but I don't know if there are other "bottlenecks" in the code.

Motivation

Currently we re-render the whole dashboard whenever there is an event. For a complex dashboard with many attributes, a single fast updating attribute can cause big performance problems, slowing even the whole browser down.

We should only re-render the parts of the dashboard that are affected by the event, i.e. the widgets that care about that particular attribute. I think handling this on the widget level also means that the widgets could be more clever about when to re-render, and how.

Fixes:

  • Removes the need to re-render everything if anything changes, wich should allow more complex dashboards and faster updates.

Changes:

  • Changed the "emitter" to allow adding callbacks for individual attributes
  • Changed the code of one widget (AttributeDisplay) to use the new subscription logic.

Tests included/Docs Updated?

  • Included for each change/fix?
  • Passing? (Merge will not be approved unless this is checked)
  • Docs updated?
  • New packages used/requires npm install?
  • Toggle added for new features?

Merge request reports