v5.5.0

changelog.md

@@ -1,5 +1,28 @@
 # Changelog
 
+## 2026-02-14 - 5.5.0 - feat(certs)
+persist ACME certificates in StorageManager, add storage-backed cert manager, default storage to filesystem, and improve certificate status reporting
+
+- Add StorageBackedCertManager to persist SmartAcme certificates under /certs/ via StorageManager
+- Default storage to filesystem path (dcrouterHomeDir/storage) when options.storage is not provided
+- Wire SmartAcme to use StorageBackedCertManager and provide SmartProxy certStore handlers that load/save/remove certs under /proxy-certs/
+- Ops server certificate handler reads persisted cert data to report expiry/issued dates and treats acme/provision-function routes with no cert data as provisioning
+- Bump @push.rocks/smartproxy dependency to ^25.3.0
+
+## 2026-02-14 - 5.4.6 - fix(deps)
+bump @push.rocks/smartproxy dependency to ^25.2.2
+
+- Updated dependency @push.rocks/smartproxy: ^25.2.0 → ^25.2.2
+- Change is a dependency-only patch update, no source code modifications
+- Current package version is 5.4.5; recommend a patch release
+
+## 2026-02-14 - 5.4.5 - fix(dcrouter)
+bump patch for release pipeline consistency - no code changes
+
+- current version: 5.4.4 (from package.json)
+- git diff: no changes detected
+- recommend patch bump to trigger release artifacts if required
+
 ## 2026-02-14 - 5.4.4 - fix(deps)
 bump @push.rocks/smartproxy to ^25.2.0
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@serve.zone/dcrouter",
   "private": false,
-  "version": "5.4.4",
+  "version": "5.5.0",
   "description": "A multifaceted routing service handling mail and SMS delivery functions.",
   "type": "module",
   "exports": {
@@ -49,7 +49,7 @@
     "@push.rocks/smartnetwork": "^4.4.0",
     "@push.rocks/smartpath": "^6.0.0",
     "@push.rocks/smartpromise": "^4.2.3",
-    "@push.rocks/smartproxy": "^25.2.0",
+    "@push.rocks/smartproxy": "^25.3.0",
     "@push.rocks/smartradius": "^1.1.1",
     "@push.rocks/smartrequest": "^5.0.1",
     "@push.rocks/smartrx": "^3.0.10",

pnpm-lock.yaml

@@ -75,8 +75,8 @@ importers:
         specifier: ^4.2.3
         version: 4.2.3
       '@push.rocks/smartproxy':
-        specifier: ^25.2.0
-        version: 25.2.0(@push.rocks/smartserve@2.0.1)(socks@2.8.7)
+        specifier: ^25.3.0
+        version: 25.3.0(@push.rocks/smartserve@2.0.1)(socks@2.8.7)
       '@push.rocks/smartradius':
         specifier: ^1.1.1
         version: 1.1.1
@@ -1040,8 +1040,8 @@ packages:
   '@push.rocks/smartpromise@4.2.3':
     resolution: {integrity: sha512-Ycg/TJR+tMt+S3wSFurOpEoW6nXv12QBtKXgBcjMZ4RsdO28geN46U09osPn9N9WuwQy1PkmTV5J/V4F9U8qEw==}
 
-  '@push.rocks/smartproxy@25.2.0':
-    resolution: {integrity: sha512-cwqtfSI3QziyZOYXZuL4/jq1KHXQRVwGvimHcqhJDsl4cac9y7fM4gKHU4B3m2/2qaih1scP9FPGwlCCVFXR7Q==}
+  '@push.rocks/smartproxy@25.3.0':
+    resolution: {integrity: sha512-ie0jP6dCSZFvrdRmlo5NTufA6AJeQdGsgVQv6M9okQ4IXBkm3LVN+u6t9T2nHalnopMJXLb+qAuq0Y2T5mxIJg==}
 
   '@push.rocks/smartpuppeteer@2.0.5':
     resolution: {integrity: sha512-yK/qSeWVHIGWRp3c8S5tfdGP6WCKllZC4DR8d8CQlEjszOSBmHtlTdyyqOMBZ/BA4kd+eU5f3A1r4K2tGYty1g==}
@@ -6441,7 +6441,7 @@ snapshots:
 
   '@push.rocks/smartpromise@4.2.3': {}
 
-  '@push.rocks/smartproxy@25.2.0(@push.rocks/smartserve@2.0.1)(socks@2.8.7)':
+  '@push.rocks/smartproxy@25.3.0(@push.rocks/smartserve@2.0.1)(socks@2.8.7)':
     dependencies:
       '@push.rocks/lik': 6.2.2
       '@push.rocks/smartacme': 8.0.0(@push.rocks/smartserve@2.0.1)(socks@2.8.7)

ts/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@serve.zone/dcrouter',
-  version: '5.4.4',
+  version: '5.5.0',
   description: 'A multifaceted routing service handling mail and SMS delivery functions.'
 }

ts/classes.dcrouter.ts

@@ -13,6 +13,7 @@ import {
 import { logger } from './logger.js';
 // Import storage manager
 import { StorageManager, type IStorageConfig } from './storage/index.js';
+import { StorageBackedCertManager } from './classes.storage-cert-manager.js';
 // Import cache system
 import { CacheDb, CacheCleaner, type ICacheDbOptions } from './cache/index.js';
 
@@ -204,7 +205,14 @@ export class DcRouter {
     this.options = {
       ...optionsArg
     };
-    
+
+    // Default storage to filesystem if not configured
+    if (!this.options.storage) {
+      this.options.storage = {
+        fsPath: plugins.path.join(paths.dcrouterHomeDir, 'storage'),
+      };
+    }
+
     // Initialize storage manager
     this.storageManager = new StorageManager(this.options.storage);
   }
@@ -437,14 +445,33 @@ export class DcRouter {
       const smartProxyConfig: plugins.smartproxy.ISmartProxyOptions = {
         ...this.options.smartProxyConfig,
         routes,
-        acme: acmeConfig
+        acme: acmeConfig,
+        certStore: {
+          loadAll: async () => {
+            const keys = await this.storageManager.list('/proxy-certs/');
+            const certs: Array<{ domain: string; publicKey: string; privateKey: string; ca?: string }> = [];
+            for (const key of keys) {
+              const data = await this.storageManager.getJSON(key);
+              if (data) certs.push(data);
+            }
+            return certs;
+          },
+          save: async (domain: string, publicKey: string, privateKey: string, ca?: string) => {
+            await this.storageManager.setJSON(`/proxy-certs/${domain}`, {
+              domain, publicKey, privateKey, ca,
+            });
+          },
+          remove: async (domain: string) => {
+            await this.storageManager.delete(`/proxy-certs/${domain}`);
+          },
+        },
       };
       
       // If we have DNS challenge handlers, create SmartAcme and wire to certProvisionFunction
       if (challengeHandlers.length > 0) {
         this.smartAcme = new plugins.smartacme.SmartAcme({
           accountEmail: acmeConfig?.accountEmail || this.options.tls?.contactEmail || 'admin@example.com',
-          certManager: new plugins.smartacme.certmanagers.MemoryCertManager(),
+          certManager: new StorageBackedCertManager(this.storageManager),
           environment: 'production',
           challengeHandlers: challengeHandlers,
           challengePriority: ['dns-01'],

ts/classes.storage-cert-manager.ts

@@ -0,0 +1,46 @@
+import * as plugins from './plugins.js';
+import { StorageManager } from './storage/index.js';
+
+/**
+ * ICertManager implementation backed by StorageManager.
+ * Persists SmartAcme certificates under a /certs/ key prefix so they
+ * survive process restarts without re-hitting ACME.
+ */
+export class StorageBackedCertManager implements plugins.smartacme.ICertManager {
+  private keyPrefix = '/certs/';
+
+  constructor(private storageManager: StorageManager) {}
+
+  async init(): Promise<void> {}
+
+  async retrieveCertificate(domainName: string): Promise<plugins.smartacme.Cert | null> {
+    const data = await this.storageManager.getJSON(this.keyPrefix + domainName);
+    if (!data) return null;
+    return new plugins.smartacme.Cert(data);
+  }
+
+  async storeCertificate(cert: plugins.smartacme.Cert): Promise<void> {
+    await this.storageManager.setJSON(this.keyPrefix + cert.domainName, {
+      id: cert.id,
+      domainName: cert.domainName,
+      created: cert.created,
+      privateKey: cert.privateKey,
+      publicKey: cert.publicKey,
+      csr: cert.csr,
+      validUntil: cert.validUntil,
+    });
+  }
+
+  async deleteCertificate(domainName: string): Promise<void> {
+    await this.storageManager.delete(this.keyPrefix + domainName);
+  }
+
+  async close(): Promise<void> {}
+
+  async wipe(): Promise<void> {
+    const keys = await this.storageManager.list(this.keyPrefix);
+    for (const key of keys) {
+      await this.storageManager.delete(key);
+    }
+  }
+}

ts/monitoring/classes.metricsmanager.ts

@@ -484,40 +484,58 @@ export class MetricsManager {
     // Use shorter cache TTL for network stats to ensure real-time updates
     return this.metricsCache.get('networkStats', () => {
       const proxyMetrics = this.dcRouter.smartProxy ? this.dcRouter.smartProxy.getMetrics() : null;
-      
+
       if (!proxyMetrics) {
         return {
           connectionsByIP: new Map<string, number>(),
           throughputRate: { bytesInPerSecond: 0, bytesOutPerSecond: 0 },
-          topIPs: [],
+          topIPs: [] as Array<{ ip: string; count: number }>,
           totalDataTransferred: { bytesIn: 0, bytesOut: 0 },
+          throughputHistory: [] as Array<{ timestamp: number; in: number; out: number }>,
+          throughputByIP: new Map<string, { in: number; out: number }>(),
+          requestsPerSecond: 0,
+          requestsTotal: 0,
         };
       }
-      
+
       // Get metrics using the new API
       const connectionsByIP = proxyMetrics.connections.byIP();
       const instantThroughput = proxyMetrics.throughput.instant();
-      
+
       // Get throughput rate
       const throughputRate = {
         bytesInPerSecond: instantThroughput.in,
         bytesOutPerSecond: instantThroughput.out
       };
-      
+
       // Get top IPs
       const topIPs = proxyMetrics.connections.topIPs(10);
-      
+
       // Get total data transferred
       const totalDataTransferred = {
         bytesIn: proxyMetrics.totals.bytesIn(),
         bytesOut: proxyMetrics.totals.bytesOut()
       };
-      
+
+      // Get throughput history from Rust engine (up to 300 seconds)
+      const throughputHistory = proxyMetrics.throughput.history(300);
+
+      // Get per-IP throughput
+      const throughputByIP = proxyMetrics.throughput.byIP();
+
+      // Get HTTP request rates
+      const requestsPerSecond = proxyMetrics.requests.perSecond();
+      const requestsTotal = proxyMetrics.requests.total();
+
       return {
         connectionsByIP,
         throughputRate,
         topIPs,
         totalDataTransferred,
+        throughputHistory,
+        throughputByIP,
+        requestsPerSecond,
+        requestsTotal,
       };
     }, 200); // Use 200ms cache for more frequent updates
   }

ts/opsserver/handlers/certificate.handler.ts

@@ -104,6 +104,22 @@ export class CertificateHandler {
         }
       }
 
+      // Check persisted cert data from StorageManager
+      if (status === 'unknown' && routeDomains.length > 0) {
+        for (const domain of routeDomains) {
+          if (expiryDate) break;
+          const cleanDomain = domain.replace(/^\*\.?/, '');
+          const certData = await dcRouter.storageManager.getJSON(`/certs/${cleanDomain}`);
+          if (certData?.validUntil) {
+            expiryDate = new Date(certData.validUntil).toISOString();
+            if (certData.created) {
+              issuedAt = new Date(certData.created).toISOString();
+            }
+            issuer = 'smartacme-dns-01';
+          }
+        }
+      }
+
       // Compute status from expiry date if we have one and status is still valid/unknown
       if (expiryDate && (status === 'valid' || status === 'unknown')) {
         const expiry = new Date(expiryDate);
@@ -124,6 +140,11 @@ export class CertificateHandler {
         status = 'valid';
       }
 
+      // ACME/provision-function routes with no cert data are still provisioning
+      if (status === 'unknown' && (source === 'acme' || source === 'provision-function')) {
+        status = 'provisioning';
+      }
+
       const canReprovision = source === 'acme' || source === 'provision-function';
 
       certificates.push({

ts/opsserver/handlers/security.handler.ts

@@ -84,21 +84,37 @@ export class SecurityHandler {
           // Get network stats from MetricsManager if available
           if (this.opsServerRef.dcRouterRef.metricsManager) {
             const networkStats = await this.opsServerRef.dcRouterRef.metricsManager.getNetworkStats();
-            
+
+            // Convert per-IP throughput Map to serializable array
+            const throughputByIP: Array<{ ip: string; in: number; out: number }> = [];
+            if (networkStats.throughputByIP) {
+              for (const [ip, tp] of networkStats.throughputByIP) {
+                throughputByIP.push({ ip, in: tp.in, out: tp.out });
+              }
+            }
+
             return {
               connectionsByIP: Array.from(networkStats.connectionsByIP.entries()).map(([ip, count]) => ({ ip, count })),
               throughputRate: networkStats.throughputRate,
               topIPs: networkStats.topIPs,
               totalDataTransferred: networkStats.totalDataTransferred,
+              throughputHistory: networkStats.throughputHistory || [],
+              throughputByIP,
+              requestsPerSecond: networkStats.requestsPerSecond || 0,
+              requestsTotal: networkStats.requestsTotal || 0,
             };
           }
-          
+
           // Fallback if MetricsManager not available
           return {
             connectionsByIP: [],
             throughputRate: { bytesInPerSecond: 0, bytesOutPerSecond: 0 },
             topIPs: [],
             totalDataTransferred: { bytesIn: 0, bytesOut: 0 },
+            throughputHistory: [],
+            throughputByIP: [],
+            requestsPerSecond: 0,
+            requestsTotal: 0,
           };
         }
       )

ts/opsserver/handlers/stats.handler.ts

@@ -255,6 +255,14 @@ export class StatsHandler {
                 const stats = await this.opsServerRef.dcRouterRef.metricsManager.getNetworkStats();
                 const serverStats = await this.collectServerStats();
 
+                // Build per-IP bandwidth lookup from throughputByIP
+                const ipBandwidth = new Map<string, { in: number; out: number }>();
+                if (stats.throughputByIP) {
+                  for (const [ip, tp] of stats.throughputByIP) {
+                    ipBandwidth.set(ip, { in: tp.in, out: tp.out });
+                  }
+                }
+
                 metrics.network = {
                   totalBandwidth: {
                     in: stats.throughputRate.bytesInPerSecond,
@@ -269,11 +277,11 @@ export class StatsHandler {
                   topEndpoints: stats.topIPs.map(ip => ({
                     endpoint: ip.ip,
                     requests: ip.count,
-                    bandwidth: {
-                      in: 0,
-                      out: 0,
-                    },
+                    bandwidth: ipBandwidth.get(ip.ip) || { in: 0, out: 0 },
                   })),
+                  throughputHistory: stats.throughputHistory || [],
+                  requestsPerSecond: stats.requestsPerSecond || 0,
+                  requestsTotal: stats.requestsTotal || 0,
                 };
               })()
             );

ts_interfaces/data/stats.ts

@@ -130,6 +130,9 @@ export interface INetworkMetrics {
       out: number;
     };
   }>;
+  throughputHistory?: Array<{ timestamp: number; in: number; out: number }>;
+  requestsPerSecond?: number;
+  requestsTotal?: number;
 }
 
 export interface IConnectionDetails {

ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@serve.zone/dcrouter',
-  version: '5.4.4',
+  version: '5.5.0',
   description: 'A multifaceted routing service handling mail and SMS delivery functions.'
 }

ts_web/appstate.ts

@@ -49,6 +49,10 @@ export interface INetworkState {
   throughputRate: { bytesInPerSecond: number; bytesOutPerSecond: number };
   totalBytes: { in: number; out: number };
   topIPs: Array<{ ip: string; count: number }>;
+  throughputByIP: Array<{ ip: string; in: number; out: number }>;
+  throughputHistory: Array<{ timestamp: number; in: number; out: number }>;
+  requestsPerSecond: number;
+  requestsTotal: number;
   lastUpdated: number;
   isLoading: boolean;
   error: string | null;
@@ -147,6 +151,10 @@ export const networkStatePart = await appState.getStatePart<INetworkState>(
     throughputRate: { bytesInPerSecond: 0, bytesOutPerSecond: 0 },
     totalBytes: { in: 0, out: 0 },
     topIPs: [],
+    throughputByIP: [],
+    throughputHistory: [],
+    requestsPerSecond: 0,
+    requestsTotal: 0,
     lastUpdated: 0,
     isLoading: false,
     error: null,
@@ -427,6 +435,10 @@ export const fetchNetworkStatsAction = networkStatePart.createAction(async (stat
         ? { in: networkStatsResponse.totalDataTransferred.bytesIn, out: networkStatsResponse.totalDataTransferred.bytesOut }
         : { in: 0, out: 0 },
       topIPs: networkStatsResponse.topIPs || [],
+      throughputByIP: networkStatsResponse.throughputByIP || [],
+      throughputHistory: networkStatsResponse.throughputHistory || [],
+      requestsPerSecond: networkStatsResponse.requestsPerSecond || 0,
+      requestsTotal: networkStatsResponse.requestsTotal || 0,
       lastUpdated: Date.now(),
       isLoading: false,
       error: null,
@@ -797,6 +809,10 @@ async function dispatchCombinedRefreshAction() {
           },
           totalBytes: network.totalBytes || { in: 0, out: 0 },
           topIPs: network.topEndpoints.map(e => ({ ip: e.endpoint, count: e.requests })),
+          throughputByIP: network.topEndpoints.map(e => ({ ip: e.endpoint, in: e.bandwidth?.in || 0, out: e.bandwidth?.out || 0 })),
+          throughputHistory: network.throughputHistory || [],
+          requestsPerSecond: network.requestsPerSecond || 0,
+          requestsTotal: network.requestsTotal || 0,
           lastUpdated: Date.now(),
           isLoading: false,
           error: null,
@@ -813,6 +829,10 @@ async function dispatchCombinedRefreshAction() {
           },
           totalBytes: network.totalBytes || { in: 0, out: 0 },
           topIPs: network.topEndpoints.map(e => ({ ip: e.endpoint, count: e.requests })),
+          throughputByIP: network.topEndpoints.map(e => ({ ip: e.endpoint, in: e.bandwidth?.in || 0, out: e.bandwidth?.out || 0 })),
+          throughputHistory: network.throughputHistory || [],
+          requestsPerSecond: network.requestsPerSecond || 0,
+          requestsTotal: network.requestsTotal || 0,
           lastUpdated: Date.now(),
           isLoading: false,
           error: null,

ts_web/elements/ops-view-network.ts

@@ -52,8 +52,7 @@ export class OpsViewNetwork extends DeesElement {
   private requestCountHistory = new Map<number, number>(); // Track requests per time bucket
   private trafficUpdateTimer: any = null;
   private requestsPerSecHistory: number[] = []; // Track requests/sec over time for trend
-  
-  // Removed byte tracking - now using real-time data from SmartProxy
+  private historyLoaded = false; // Whether server-side throughput history has been loaded
 
   constructor() {
     super();
@@ -95,7 +94,7 @@ export class OpsViewNetwork extends DeesElement {
     // Fixed 5 minute time range
     const range = 5 * 60 * 1000; // 5 minutes
     const bucketSize = range / 60; // 60 data points
-    
+
     // Initialize with empty data points for both in and out
     const emptyData = Array.from({ length: 60 }, (_, i) => {
       const time = now - ((59 - i) * bucketSize);
@@ -104,13 +103,61 @@ export class OpsViewNetwork extends DeesElement {
         y: 0,
       };
     });
-    
+
     this.trafficDataIn = [...emptyData];
     this.trafficDataOut = emptyData.map(point => ({ ...point }));
-    
+
     this.lastTrafficUpdateTime = now;
   }
 
+  /**
+   * Load server-side throughput history into the chart.
+   * Called once when history data first arrives from the Rust engine.
+   * This pre-populates the chart so users see historical data immediately
+   * instead of starting from all zeros.
+   */
+  private loadThroughputHistory() {
+    const history = this.networkState.throughputHistory;
+    if (!history || history.length === 0) return;
+
+    this.historyLoaded = true;
+
+    // Convert history points to chart data format (bytes/sec → Mbit/s)
+    const historyIn = history.map(p => ({
+      x: new Date(p.timestamp).toISOString(),
+      y: Math.round((p.in * 8) / 1000000 * 10) / 10,
+    }));
+    const historyOut = history.map(p => ({
+      x: new Date(p.timestamp).toISOString(),
+      y: Math.round((p.out * 8) / 1000000 * 10) / 10,
+    }));
+
+    // Use history as the chart data, keeping the most recent 60 points (5 min window)
+    const sliceStart = Math.max(0, historyIn.length - 60);
+    this.trafficDataIn = historyIn.slice(sliceStart);
+    this.trafficDataOut = historyOut.slice(sliceStart);
+
+    // If fewer than 60 points, pad the front with zeros
+    if (this.trafficDataIn.length < 60) {
+      const now = Date.now();
+      const range = 5 * 60 * 1000;
+      const bucketSize = range / 60;
+      const padCount = 60 - this.trafficDataIn.length;
+      const firstTimestamp = this.trafficDataIn.length > 0
+        ? new Date(this.trafficDataIn[0].x).getTime()
+        : now;
+
+      const padIn = Array.from({ length: padCount }, (_, i) => ({
+        x: new Date(firstTimestamp - ((padCount - i) * bucketSize)).toISOString(),
+        y: 0,
+      }));
+      const padOut = padIn.map(p => ({ ...p }));
+
+      this.trafficDataIn = [...padIn, ...this.trafficDataIn];
+      this.trafficDataOut = [...padOut, ...this.trafficDataOut];
+    }
+  }
+
   public static styles = [
     cssManager.defaultStyles,
     viewHostCss,
@@ -352,21 +399,6 @@ export class OpsViewNetwork extends DeesElement {
     return `${size.toFixed(1)} ${units[unitIndex]}`;
   }
 
-  private calculateRequestsPerSecond(): number {
-    // Calculate from actual request data in the last minute
-    const oneMinuteAgo = Date.now() - 60000;
-    const recentRequests = this.networkRequests.filter(req => req.timestamp >= oneMinuteAgo);
-    const reqPerSec = Math.round(recentRequests.length / 60);
-    
-    // Track history for trend (keep last 20 values)
-    this.requestsPerSecHistory.push(reqPerSec);
-    if (this.requestsPerSecHistory.length > 20) {
-      this.requestsPerSecHistory.shift();
-    }
-    
-    return reqPerSec;
-  }
-
   private calculateThroughput(): { in: number; out: number } {
     // Use real throughput data from network state
     return {
@@ -376,16 +408,17 @@ export class OpsViewNetwork extends DeesElement {
   }
 
   private renderNetworkStats(): TemplateResult {
-    const reqPerSec = this.calculateRequestsPerSecond();
+    // Use server-side requests/sec from SmartProxy's Rust engine
+    const reqPerSec = this.networkState.requestsPerSecond || 0;
     const throughput = this.calculateThroughput();
     const activeConnections = this.statsState.serverStats?.activeConnections || 0;
-    
-    // Throughput data is now available in the stats tiles
 
-    // Use request count history for the requests/sec trend
+    // Track requests/sec history for the trend sparkline
+    this.requestsPerSecHistory.push(reqPerSec);
+    if (this.requestsPerSecHistory.length > 20) {
+      this.requestsPerSecHistory.shift();
+    }
     const trendData = [...this.requestsPerSecHistory];
-    
-    // If we don't have enough data, pad with zeros
     while (trendData.length < 20) {
       trendData.unshift(0);
     }
@@ -398,7 +431,7 @@ export class OpsViewNetwork extends DeesElement {
         type: 'number',
         icon: 'plug',
         color: activeConnections > 100 ? '#f59e0b' : '#22c55e',
-        description: `Total: ${this.statsState.serverStats?.totalConnections || 0}`,
+        description: `Total: ${this.networkState.requestsTotal || this.statsState.serverStats?.totalConnections || 0}`,
         actions: [
           {
             name: 'View Details',
@@ -416,7 +449,7 @@ export class OpsViewNetwork extends DeesElement {
         icon: 'chartLine',
         color: '#3b82f6',
         trendData: trendData,
-        description: `Average over last minute`,
+        description: `Total: ${this.formatNumber(this.networkState.requestsTotal || 0)} requests`,
       },
       {
         id: 'throughputIn',
@@ -462,20 +495,33 @@ export class OpsViewNetwork extends DeesElement {
     if (this.networkState.topIPs.length === 0) {
       return html``;
     }
-    
+
+    // Build per-IP bandwidth lookup
+    const bandwidthByIP = new Map<string, { in: number; out: number }>();
+    if (this.networkState.throughputByIP) {
+      for (const entry of this.networkState.throughputByIP) {
+        bandwidthByIP.set(entry.ip, { in: entry.in, out: entry.out });
+      }
+    }
+
     // Calculate total connections across all top IPs
     const totalConnections = this.networkState.topIPs.reduce((sum, ipData) => sum + ipData.count, 0);
-    
+
     return html`
       <dees-table
         .data=${this.networkState.topIPs}
-        .displayFunction=${(ipData: { ip: string; count: number }) => ({
-          'IP Address': ipData.ip,
-          'Connections': ipData.count,
-          'Percentage': totalConnections > 0 ? ((ipData.count / totalConnections) * 100).toFixed(1) + '%' : '0%',
-        })}
+        .displayFunction=${(ipData: { ip: string; count: number }) => {
+          const bw = bandwidthByIP.get(ipData.ip);
+          return {
+            'IP Address': ipData.ip,
+            'Connections': ipData.count,
+            'Bandwidth In': bw ? this.formatBitsPerSecond(bw.in) : '0 bit/s',
+            'Bandwidth Out': bw ? this.formatBitsPerSecond(bw.out) : '0 bit/s',
+            'Share': totalConnections > 0 ? ((ipData.count / totalConnections) * 100).toFixed(1) + '%' : '0%',
+          };
+        }}
         heading1="Top Connected IPs"
-        heading2="IPs with most active connections"
+        heading2="IPs with most active connections and bandwidth"
         .pagination=${false}
         dataName="ip"
       ></dees-table>
@@ -515,13 +561,10 @@ export class OpsViewNetwork extends DeesElement {
       }
     }
     
-    // Generate traffic data based on request history
-    this.updateTrafficData();
-  }
-
-  private updateTrafficData() {
-    // This method is called when network data updates
-    // The actual chart updates are handled by the timer calling addTrafficDataPoint()
+    // Load server-side throughput history into chart (once)
+    if (!this.historyLoaded && this.networkState.throughputHistory && this.networkState.throughputHistory.length > 0) {
+      this.loadThroughputHistory();
+    }
   }
   
   private startTrafficUpdateTimer() {