perf(dashboard): incremental cache event fetching with watermark

After initial 200-event load, subsequent polls only fetch events newer
than the last seen timestamp. Session stats computed client-side from
cached events instead of a separate DB query. Eliminates redundant
full-table scans and log parsing on every 15s poll cycle.

Author: ualtinok

packages/dashboard/src-tauri/src/commands.rs

@@ -183,8 +183,8 @@ pub fn get_session_cache_stats(max_lines: Option<usize>, limit: Option<usize>) -
 }
 
 #[tauri::command]
-pub fn get_cache_events_from_db(limit: Option<usize>) -> Vec<db::DbCacheEvent> {
-    db::get_cache_events_from_db(limit.unwrap_or(200))
+pub fn get_cache_events_from_db(limit: Option<usize>, since_timestamp: Option<i64>) -> Vec<db::DbCacheEvent> {
+    db::get_cache_events_from_db(limit.unwrap_or(200), since_timestamp)
 }
 
 #[tauri::command]

packages/dashboard/src-tauri/src/db.rs

@@ -492,27 +492,49 @@ fn match_log_cause(
     }
 }
 
-fn load_raw_db_cache_events(limit: usize) -> Result<Vec<RawDbCacheEvent>, rusqlite::Error> {
+fn load_raw_db_cache_events(limit: usize, since_timestamp: Option<i64>) -> Result<Vec<RawDbCacheEvent>, rusqlite::Error> {
     let Some(opencode_db_path) = resolve_opencode_db_path() else {
         return Ok(Vec::new());
     };
 
     let conn = open_readonly(&opencode_db_path)?;
-    let mut stmt = conn.prepare(
-        "SELECT CAST(m.id AS TEXT), m.session_id, m.time_created,
-                COALESCE(CAST(json_extract(m.data, '$.tokens.input') AS INTEGER), 0) AS input_tokens,
-                COALESCE(CAST(json_extract(m.data, '$.tokens.cache.read') AS INTEGER), 0) AS cache_read,
-                COALESCE(CAST(json_extract(m.data, '$.tokens.cache.write') AS INTEGER), 0) AS cache_write,
-                COALESCE(CAST(json_extract(m.data, '$.tokens.total') AS INTEGER), 0) AS total_tokens,
-                CAST(json_extract(m.data, '$.agent') AS TEXT) AS agent
-         FROM message m
-         WHERE json_extract(m.data, '$.role') = 'assistant'
-           AND COALESCE(CAST(json_extract(m.data, '$.tokens.total') AS INTEGER), 0) > 0
-         ORDER BY m.time_created DESC
-         LIMIT ?1",
-    )?;
 
-    let rows = stmt.query_map([limit as i64], |row| {
+    let (sql, params): (String, Vec<Box<dyn rusqlite::types::ToSql>>) = if let Some(since) = since_timestamp {
+        (
+            "SELECT CAST(m.id AS TEXT), m.session_id, m.time_created,
+                    COALESCE(CAST(json_extract(m.data, '$.tokens.input') AS INTEGER), 0) AS input_tokens,
+                    COALESCE(CAST(json_extract(m.data, '$.tokens.cache.read') AS INTEGER), 0) AS cache_read,
+                    COALESCE(CAST(json_extract(m.data, '$.tokens.cache.write') AS INTEGER), 0) AS cache_write,
+                    COALESCE(CAST(json_extract(m.data, '$.tokens.total') AS INTEGER), 0) AS total_tokens,
+                    CAST(json_extract(m.data, '$.agent') AS TEXT) AS agent
+             FROM message m
+             WHERE json_extract(m.data, '$.role') = 'assistant'
+               AND COALESCE(CAST(json_extract(m.data, '$.tokens.total') AS INTEGER), 0) > 0
+               AND m.time_created > ?1
+             ORDER BY m.time_created DESC
+             LIMIT ?2".to_string(),
+            vec![Box::new(since) as Box<dyn rusqlite::types::ToSql>, Box::new(limit as i64)],
+        )
+    } else {
+        (
+            "SELECT CAST(m.id AS TEXT), m.session_id, m.time_created,
+                    COALESCE(CAST(json_extract(m.data, '$.tokens.input') AS INTEGER), 0) AS input_tokens,
+                    COALESCE(CAST(json_extract(m.data, '$.tokens.cache.read') AS INTEGER), 0) AS cache_read,
+                    COALESCE(CAST(json_extract(m.data, '$.tokens.cache.write') AS INTEGER), 0) AS cache_write,
+                    COALESCE(CAST(json_extract(m.data, '$.tokens.total') AS INTEGER), 0) AS total_tokens,
+                    CAST(json_extract(m.data, '$.agent') AS TEXT) AS agent
+             FROM message m
+             WHERE json_extract(m.data, '$.role') = 'assistant'
+               AND COALESCE(CAST(json_extract(m.data, '$.tokens.total') AS INTEGER), 0) > 0
+             ORDER BY m.time_created DESC
+             LIMIT ?1".to_string(),
+            vec![Box::new(limit as i64) as Box<dyn rusqlite::types::ToSql>],
+        )
+    };
+
+    let mut stmt = conn.prepare(&sql)?;
+    let params_refs: Vec<&dyn rusqlite::types::ToSql> = params.iter().map(|p| p.as_ref()).collect();
+    let rows = stmt.query_map(params_refs.as_slice(), |row| {
         Ok(RawDbCacheEvent {
             message_id: row.get(0)?,
             session_id: row.get(1)?,
@@ -584,15 +606,15 @@ fn build_db_cache_events(rows: Vec<RawDbCacheEvent>, enrich_causes: bool) -> Vec
     chronological
 }
 
-pub fn get_cache_events_from_db(limit: usize) -> Vec<DbCacheEvent> {
-    load_raw_db_cache_events(limit)
+pub fn get_cache_events_from_db(limit: usize, since_timestamp: Option<i64>) -> Vec<DbCacheEvent> {
+    load_raw_db_cache_events(limit, since_timestamp)
         .map(|rows| build_db_cache_events(rows, true))
         .unwrap_or_default()
 }
 
 pub fn get_session_cache_stats_from_db(limit: usize) -> Vec<SessionCacheStats> {
     // Reuse raw rows instead of re-querying + re-parsing logs
-    let events = load_raw_db_cache_events(200)
+    let events = load_raw_db_cache_events(200, None)
         .map(|rows| build_db_cache_events(rows, false)) // skip log enrichment for stats
         .unwrap_or_default();
     let mut map: HashMap<String, (usize, i64, i64, i64, i64, usize)> = HashMap::new();

packages/dashboard/src/components/CacheDiagnostics/CacheDiagnostics.tsx

@@ -1,6 +1,6 @@
 import { createSignal, For, Show, onCleanup, onMount } from "solid-js";
 import type { DbCacheEvent, SessionCacheStats } from "../../lib/types";
-import { formatDateTime, getCacheEventsFromDb, getSessionCacheStatsFromDb, getSessions, truncate } from "../../lib/api";
+import { formatDateTime, getCacheEventsFromDb, getSessions, truncate } from "../../lib/api";
 
 export default function CacheDiagnostics() {
   const [events, setEvents] = createSignal<DbCacheEvent[]>([]);
@@ -12,15 +12,61 @@ export default function CacheDiagnostics() {
   const [hideSubagents, setHideSubagents] = createSignal(true);
   const [subagentIds, setSubagentIds] = createSignal<Set<string>>(new Set());
 
+  // Track watermark for incremental fetching — only fetch new events after initial load
+  let watermark: number | null = null;
+
   const fetchData = async () => {
     try {
-      const [eventsData, statsData, sessions] = await Promise.all([
-        getCacheEventsFromDb(200),
-        getSessionCacheStatsFromDb(20),
+      const [newEvents, sessions] = await Promise.all([
+        getCacheEventsFromDb(200, watermark),
         getSessions(),
       ]);
-      setEvents(eventsData);
-      setSessionStats(statsData);
+
+      if (watermark === null) {
+        // Initial load — use full result
+        setEvents(newEvents);
+      } else if (newEvents.length > 0) {
+        // Incremental — prepend new events (they're newest-first from DB, but
+        // build_db_cache_events reverses to chronological), trim to 200
+        setEvents(prev => [...prev, ...newEvents].slice(-200));
+      }
+
+      // Update watermark to latest timestamp
+      const allEvents = events();
+      if (allEvents.length > 0) {
+        watermark = Math.max(...allEvents.map(e => e.timestamp));
+      }
+
+      // Compute session stats client-side from cached events (no extra DB query)
+      const statsMap = new Map<string, { count: number; read: number; write: number; input: number; lastTs: number; busts: number }>();
+      for (const e of allEvents) {
+        if (!e.session_id) continue;
+        const s = statsMap.get(e.session_id) ?? { count: 0, read: 0, write: 0, input: 0, lastTs: 0, busts: 0 };
+        s.count++;
+        s.read += e.cache_read;
+        s.write += e.cache_write;
+        s.input += e.input_tokens;
+        if (e.timestamp > s.lastTs) s.lastTs = e.timestamp;
+        if (e.severity === "bust" || e.severity === "full_bust") s.busts++;
+        statsMap.set(e.session_id, s);
+      }
+      const stats = [...statsMap.entries()]
+        .map(([sid, s]) => {
+          const total = s.read + s.write + s.input;
+          return {
+            session_id: sid,
+            event_count: s.count,
+            total_cache_read: s.read,
+            total_cache_write: s.write,
+            total_input: s.input,
+            hit_ratio: total > 0 ? s.read / total : 0,
+            last_timestamp: new Date(s.lastTs).toISOString(),
+            bust_count: s.busts,
+          };
+        })
+        .sort((a, b) => b.last_timestamp.localeCompare(a.last_timestamp));
+      setSessionStats(stats);
+
       // Build session ID → title lookup and subagent set
       const names: Record<string, string> = {};
       const subs = new Set<string>();

packages/dashboard/src/lib/api.ts

@@ -143,9 +143,13 @@ export async function getCacheEvents(
 }
 
 export async function getCacheEventsFromDb(
-  limit?: number
+  limit?: number,
+  sinceTimestamp?: number | null
 ): Promise<DbCacheEvent[]> {
-  return invoke("get_cache_events_from_db", { limit: limit ?? 200 });
+  return invoke("get_cache_events_from_db", {
+    limit: limit ?? 200,
+    sinceTimestamp: sinceTimestamp ?? null,
+  });
 }
 
 // ── Config API ──────────────────────────────────────────────