Real-Time Transaction Dashboard
Real-time financial transaction monitoring with live metrics, dynamic charts, and automatic alerts. No polling. No manual refresh.
This demo is a real-time financial monitoring dashboard that simulates a transaction flow with aggregated metrics, interactive charts, and push notifications via WebSocket. A background service generates ~10 transactions per second, metrics are aggregated in sliding windows, and everything is broadcast to connected clients via SignalR with no polling required.
Live Demo
How it Works
Generation
A background service (TransactionProcessorService) simulates financial transactions at ~10 TPS, inserts them into MySQL, and publishes them to a high-capacity Channel<T>.
Aggregation
Every 500ms, MetricsAggregator computes metrics in 1-min, 5-min, and 1-hour windows (TPS, volume, success rate, flagged transactions) and caches them in IMemoryCache.
Broadcasting
DashboardBroadcaster reads from the channel and cache every 500ms, sends batches of transactions + updated metrics to all connected clients via SignalR (WebSocket).
Visualization
The Blazor Server frontend receives data in real time and updates metrics, charts (line, doughnut, bar via Chart.js), and the transactions table with highlight animations.
Key Features
Live metrics
TPS, volume, success rate, and flagged transactions updated every 500ms.
Line chart
Transaction volume in a sliding window of ~300 data points.
Doughnut chart
Distribution by status: Completed, Pending, Processing, Failed, Flagged.
Bar chart
Top 5 transaction sources: ATM, POS, Online, Transfer, Mobile.
Transaction table
Recent transactions with animated highlight for new rows.
Connection indicator
Live SignalR status: Connected, Reconnecting, Disconnected.
Bilingual support
Interface available in English and Spanish.
Health check
/health endpoint with database verification.
Tech Stack
Architecture Patterns
Batched broadcasting
Efficient mass delivery: groups transactions and metrics before sending to clients.
Pre-computed metrics with cache
Avoids expensive per-request queries using IMemoryCache with sliding windows.
Channel backpressure
BoundedChannel of 10K items for flow control between producer and consumers.
Typed SignalR Hub
Hub<IDashboardClient> for type-safe server-client communication.
Source Code
View on GitHubNeed a real-time dashboard for your business?
Let's discuss how I can build real-time monitoring dashboards with metrics, charts, and alerts for your organization.
Get in touch