Performance issue with multiple gauges on the same page
frazer84 opened this issue · 5 comments
I've created a dashboard to show live data of aircraft instruments. It's about 10 different gauges with values updated every 500 ms. This works for a while, but quickly starts to lag and after a while, the whole page is almost unresponsive and only a few updates to the gauges can be seen.
I have disabled the animation, which helped to keep the update framerate at acceptable levels. But I really liked the smooth feeling of animated gauges.
Is there any way to optimize this?
Thanks for a nice library btw!
Here's a screenshot after making a Chrome DevTools profiling session:
Hi, I had an issue where I suspected there was insufficent time to complete drawing / updating of a gauge.
Under Windows 10 & Firefox.
Possibly there is a mechanism to manage / determine if a gauge has completed the previous update request.
The issue seemed to build up as requests for gauge updates were successvily made.
My solution was to slow the update rates down, to permit a gauge to complete drawing the previous update.
One would like 3 per second. I arrived at ~1.5s intervals in my solution to engineer some design margin. Though tend recall nearer 0.7s update rate was the practical limit on the system tested at the time.
Hope this helps.
I found that I had to run .update({...}) every 6 seconds to clear out things to be the solution