Innovative Design and Implementation of the Barad‑Dur Custom Monitoring Dashboard

The Ant Monitoring product has introduced a new custom dashboard called Barad‑Dur, aiming to meet growing experience demands for real‑time business monitoring by offering a WYSIWYG editor, richer chart types, more data sources, and extensibility for both internal and external users.

Product Experience – Barad‑Dur provides several interaction innovations: scaling from all sides and corners (unlike typical dashboards that only support bottom‑right scaling, which requires adjusting (left,top,width,height) parameters), one‑step chart swapping via drag‑and‑drop, automatic layout adjustment that respects operation direction, arbitrary chart placement, layout reset, and in‑dashboard static text editing.

Feature Comparison – A table compares Barad‑Dur with common market dashboards, showing that Barad‑Dur supports arbitrary dragging, scaling, multi‑chart types, real‑time chart editing, data import/export, and arbitrary layout, while many competitors lack scaling and layout reset capabilities.

Controller Concept – The dashboard is likened to a vehicle’s instrument panel, consisting of both monitors and controllers; Barad‑Dur adds controller widgets (e.g., alarm toggle, DingTalk chat launch) to transform the dashboard from a pure monitor into a controllable system.

Technical Implementation – Developers can extend Barad‑Dur by inheriting AbstractDatasource and implementing doRequestData , then registering the source via registerDatasource . The platform wraps all sources with caching, incremental loading, and request merging.

Unified Time‑Series Database – Barad‑Dur defines a universal time‑series format supporting multiple keys and values, enabling any chart to consume any data source without reconfiguration and allowing front‑end calculations to be expressed as composable time‑series sources.

Scene Graph Design – Inspired by game engine scene graphs, Barad‑Dur models charts and the dashboard as a tree where each node has its own MVC components, allowing independent evolution of data sources, views, and control logic, and supporting global and per‑chart time‑axis configurations.

Future Outlook – Barad‑Dur already integrates OpenTSDB and CeresDB and plans to support additional sources such as PromQL, InfluxDB, and MySQL. Pre‑defined chart groups and variable templates will simplify dashboard creation, and import/export features will aid migration from other products.

The article concludes that Barad‑Dur’s design advances cloud‑native monitoring experiences and invites readers to share feedback and explore further innovations.