# Dashboard 2 gauge tank level performance

**URL:** <https://discourse.nodered.org/t/dashboard-2-gauge-tank-level-performance/95007>\
**Category:** Dashboard\
**Tags:** dashboard-2\
**Created:** [30 January 2025 14:44 UTC](https://discourse.nodered.org/t/dashboard-2-gauge-tank-level-performance/95007 "2025-01-30T14:44:27Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![NodyRed](https://avatars.discourse-cdn.com/v4/letter/n/91b2a8/32.png) [@NodyRed](https://discourse.nodered.org/u/NodyRed)\
**Post date:** [30 January 2025 14:44 UTC](https://discourse.nodered.org/t/dashboard-2-gauge-tank-level-performance/95007/1 "2025-01-30T14:44:27Z")

</div>

Using dashboard 2 gauge as tank level. I noticed that cpu load goes to 10% when showing a page with the gauge tank level.  
Browser: Firefox latest  
Dashboard: 1.22.0

Is this a (known) bug? Sure it is not a high cpu load and for the animation some cpu load is required.

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [30 January 2025 14:52 UTC](https://discourse.nodered.org/t/dashboard-2-gauge-tank-level-performance/95007/2 "2025-01-30T14:52:09Z")

</div>

The animation of that kind is CPU intensive without doubt.

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [30 January 2025 16:07 UTC](https://discourse.nodered.org/t/dashboard-2-gauge-tank-level-performance/95007/3 "2025-01-30T16:07:33Z")

</div>

How often are you updating it? What hardware is the browser running on?

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [30 January 2025 16:09 UTC](https://discourse.nodered.org/t/dashboard-2-gauge-tank-level-performance/95007/4 "2025-01-30T16:09:21Z")

</div>

> [@Colin](#):
>
> How often are you updating it

Doesn't make any difference. The wave animation is running constantly...

---

<div class="post-metadata">

**Author:** ![NodyRed](https://avatars.discourse-cdn.com/v4/letter/n/91b2a8/32.png) [@NodyRed](https://discourse.nodered.org/u/NodyRed)\
**Post date:** [30 January 2025 16:25 UTC](https://discourse.nodered.org/t/dashboard-2-gauge-tank-level-performance/95007/5 "2025-01-30T16:25:50Z")

</div>

I'm using the 3/4 gauge for now to avoid this. Just thought there might be improvements by slower animation or so. Or maybe an option to activate/deactivate animation. But it is not so important.

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [30 January 2025 16:33 UTC](https://discourse.nodered.org/t/dashboard-2-gauge-tank-level-performance/95007/6 "2025-01-30T16:33:47Z")

</div>

Speed of the animation will not affect performance significantly. The way it is created just involves strategies which are not easy for browser to render. And there's not much to change without having to compromise the look and feel.

For sure the option to disable animation is must for such kind of thingy.

---

<div class="post-metadata">

**Author:** ![NodyRed](https://avatars.discourse-cdn.com/v4/letter/n/91b2a8/32.png) [@NodyRed](https://discourse.nodered.org/u/NodyRed)\
**Post date:** [30 January 2025 16:52 UTC](https://discourse.nodered.org/t/dashboard-2-gauge-tank-level-performance/95007/7 "2025-01-30T16:52:22Z")

</div>

Ok.  
Switched to 3/4 gauge which is fine enough. Just need to figure out why I can not dynamically set color names from here: why [Material color palette — Vuetify](https://vuetifyjs.com/en/styles/colors/#material-colors)

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [30 January 2025 17:24 UTC](https://discourse.nodered.org/t/dashboard-2-gauge-tank-level-performance/95007/8 "2025-01-30T17:24:31Z")

</div>

I have shared tank-like thingy made with ui\_template  
If the tank shape is important for your design, you may consider using DIY version of it. This gives to you freedom to make it look and behave as you like

> [@Tank level indication inside of ui-template(v2)](https://discourse.nodered.org/t/tank-level-indication-inside-of-ui-template-v2/86595):
>
> I need to put a tank level indication or ui-gauge inside of a ui-template. Does anyone have a idea on how to achieve that?

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [13 February 2025 17:25 UTC](https://discourse.nodered.org/t/dashboard-2-gauge-tank-level-performance/95007/9 "2025-02-13T17:25:14Z")

</div>

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.