@mtayfur/opencode-cache-view 0.0.3 → 0.0.4

package/README.md

@@ -28,7 +28,7 @@ customize-opencode       3.1K tok
 
 - **Cache:** `Hit` is `cache.read / (input + cache.read + cache.write)` for the latest regular LLM step. `Session Hit` is the aggregate OpenCode session ratio, including compaction calls. `Miss` combines uncached input and cache writes.
 - **Estimated Tokens:** Uses one character-based estimator for the visible system, user, tool, reasoning, and output content from the latest completed compaction summary, its preserved tail, and subsequent messages loaded in the TUI. Provider system prompts, tool schemas, and media tokens are not included.
-- **Speed:** `TPS` is calculated when an LLM step finishes as `(output + reasoning) / step duration`, using OpenCode's exact provider token totals. It therefore includes hidden reasoning without estimating from exposed reasoning summaries. While a step is running, the value is shown as `… tok/s`; tool execution between steps is excluded. `TTFT` retains the estimated delay to the first visible reasoning or text block, and `Trend` shows the latest eight completed-step TPS values.
+- **Speed:** During streaming, `TPS` shows a `~`-prefixed estimate from visible text and reasoning deltas over the latest five seconds. Hidden reasoning with no deltas uses the current turn's cumulative rate when available, otherwise the previous completed turn, or remains `… tok/s` when neither exists. Completed model steps accumulate `(output + reasoning)` tokens and full step duration across tool calls, excluding tool execution time. The cumulative rate remains `~`-prefixed while the turn is incomplete; the final non-tool-call step replaces it with the exact weighted turn throughput. `TTFT` retains the estimated delay to the first visible reasoning or text block, and `Trend` shows the latest eight completed-turn TPS values.
 - **Loaded Skills:** Shows active, non-compacted skill outputs and their estimated token counts. When a skill is loaded more than once, the latest load is shown.
 
 Rows and the cache-hit bar adapt to the available sidebar width. The arrow next to the hit rate compares the latest two LLM steps. Sections can be expanded or collapsed with the mouse.

package/dist/index.js

@@ -177,7 +177,9 @@ function CacheStatus(props) {
   });
   const speedValue = createMemo(() => {
     const speed = metrics().speed;
-    return speed.active ? "\u2026 tok/s" : formatSpeed(speed.value);
+    if (speed.active && speed.value === undefined)
+      return "\u2026 tok/s";
+    return formatSpeed(speed.value, speed.estimated);
   });
   onMount(() => {
     let refreshTimer;
@@ -363,11 +365,69 @@ function loadedSkills(messages, parts, activeStart, estimator) {
   return [...skills.values()];
 }
 
+// src/token-estimator.ts
+function estimateTokenUnits(text) {
+  let units = 0;
+  for (const char of text) {
+    const code = char.codePointAt(0) ?? 0;
+    const isWide = code >= 11904 && code <= 40959 || code >= 44032 && code <= 55203 || code >= 63744 && code <= 64255;
+    units += isWide ? 4 : 1;
+  }
+  return units;
+}
+
+class TokenEstimator {
+  cache = new Map;
+  count(key, text) {
+    const cached = this.cache.get(key);
+    if (cached?.text === text)
+      return cached.tokens;
+    const units = estimateTokenUnits(text);
+    const tokens = Math.ceil(units / 4);
+    this.cache.set(key, { text, units, tokens });
+    return tokens;
+  }
+  append(key, delta) {
+    const cached = this.cache.get(key);
+    if (!cached)
+      return;
+    const units = cached.units + estimateTokenUnits(delta);
+    this.cache.set(key, {
+      text: cached.text + delta,
+      units,
+      tokens: Math.ceil(units / 4)
+    });
+  }
+  clear() {
+    this.cache.clear();
+  }
+}
+
 // src/metrics/speed.ts
+var STREAM_WINDOW = 5000;
+var MIN_STREAM_DURATION = 1000;
 function createSpeedTracker(api) {
   const starts = new Map;
   const latest = new Map;
   const trends = new Map;
+  const turnTotals = new Map;
+  const streamParts = new Map;
+  const streamSamples = new Map;
+  const clearStream = (messageID) => {
+    streamSamples.delete(messageID);
+    for (const [partID, stream] of streamParts) {
+      if (stream.messageID === messageID)
+        streamParts.delete(partID);
+    }
+  };
+  const streamingSpeed = (messageID, now) => {
+    const samples = (streamSamples.get(messageID) ?? []).filter((sample) => sample.time >= now - STREAM_WINDOW);
+    if (samples.length === 0)
+      return;
+    const tokens = samples.reduce((sum, sample) => sum + sample.tokens, 0);
+    const duration = Math.max(MIN_STREAM_DURATION, samples.at(-1).time - samples[0].time);
+    return tokens / duration * 1000;
+  };
   const part = api.event.on("message.part.updated", (event) => {
     const value = event.properties.part;
     if (value.type === "step-start") {
@@ -385,51 +445,100 @@ function createSpeedTracker(api) {
     starts.delete(value.messageID);
     if (!start || start.sessionID !== event.properties.sessionID)
       return;
+    clearStream(value.messageID);
     const duration = event.properties.time - start.time;
     const tokens = value.tokens.output + value.tokens.reasoning;
     if (duration <= 0 || tokens <= 0)
       return;
-    const speed = tokens / duration * 1000;
+    const previous = turnTotals.get(start.sessionID) ?? { tokens: 0, duration: 0 };
+    const turn = {
+      tokens: previous.tokens + tokens,
+      duration: previous.duration + duration
+    };
+    const speed = turn.tokens / turn.duration * 1000;
     latest.set(start.sessionID, speed);
+    if (value.reason === "tool-calls") {
+      turnTotals.set(start.sessionID, turn);
+      return;
+    }
+    turnTotals.delete(start.sessionID);
     trends.set(start.sessionID, [...trends.get(start.sessionID) ?? [], speed].slice(-8));
   });
+  const delta = api.event.on("message.part.delta", (event) => {
+    if (event.properties.field !== "text" || !starts.has(event.properties.messageID))
+      return;
+    const now = Date.now();
+    const previous = streamParts.get(event.properties.partID) ?? {
+      messageID: event.properties.messageID,
+      units: 0
+    };
+    const previousTokens = Math.ceil(previous.units / 4);
+    const units = previous.units + estimateTokenUnits(event.properties.delta);
+    const tokens = Math.ceil(units / 4) - previousTokens;
+    streamParts.set(event.properties.partID, { messageID: event.properties.messageID, units });
+    if (tokens <= 0)
+      return;
+    const samples = streamSamples.get(event.properties.messageID) ?? [];
+    streamSamples.set(event.properties.messageID, [...samples, { time: now, tokens }].filter((sample) => sample.time >= now - STREAM_WINDOW));
+  });
   const message = api.event.on("message.updated", (event) => {
     if (event.properties.info.role !== "assistant")
       return;
     if (event.properties.info.time.completed === undefined && event.properties.info.error === undefined)
       return;
     starts.delete(event.properties.info.id);
+    clearStream(event.properties.info.id);
+    if (event.properties.info.error !== undefined)
+      turnTotals.delete(event.properties.sessionID);
   });
   const messageRemoved = api.event.on("message.removed", (event) => {
     starts.delete(event.properties.messageID);
+    clearStream(event.properties.messageID);
   });
   const sessionDeleted = api.event.on("session.deleted", (event) => {
     latest.delete(event.properties.sessionID);
     trends.delete(event.properties.sessionID);
+    turnTotals.delete(event.properties.sessionID);
     for (const [messageID, start] of starts) {
-      if (start.sessionID === event.properties.sessionID)
+      if (start.sessionID === event.properties.sessionID) {
         starts.delete(messageID);
+        clearStream(messageID);
+      }
     }
   });
   return {
     get(sessionID) {
-      let active = false;
-      for (const start of starts.values()) {
-        if (start.sessionID === sessionID) {
-          active = true;
-          break;
+      let activeMessageID;
+      let activeTime = Number.NEGATIVE_INFINITY;
+      for (const [messageID, start] of starts) {
+        if (start.sessionID === sessionID && start.time > activeTime) {
+          activeMessageID = messageID;
+          activeTime = start.time;
         }
       }
-      return { active, value: latest.get(sessionID), trend: trends.get(sessionID) ?? [] };
+      const active = activeMessageID !== undefined;
+      const live = activeMessageID === undefined ? undefined : streamingSpeed(activeMessageID, Date.now());
+      const fallback = latest.get(sessionID);
+      const provisional = active || turnTotals.has(sessionID);
+      return {
+        active,
+        value: active ? live ?? fallback : fallback,
+        estimated: provisional && (live !== undefined || fallback !== undefined),
+        trend: trends.get(sessionID) ?? []
+      };
     },
     dispose() {
       part();
+      delta();
       message();
       messageRemoved();
       sessionDeleted();
       starts.clear();
       latest.clear();
       trends.clear();
+      turnTotals.clear();
+      streamParts.clear();
+      streamSamples.clear();
     }
   };
 }
@@ -494,44 +603,6 @@ function readMetrics(api, sessionID, estimator, speed) {
   };
 }
 
-// src/token-estimator.ts
-function estimateTokenUnits(text) {
-  let units = 0;
-  for (const char of text) {
-    const code = char.codePointAt(0) ?? 0;
-    const isWide = code >= 11904 && code <= 40959 || code >= 44032 && code <= 55203 || code >= 63744 && code <= 64255;
-    units += isWide ? 4 : 1;
-  }
-  return units;
-}
-
-class TokenEstimator {
-  cache = new Map;
-  count(key, text) {
-    const cached = this.cache.get(key);
-    if (cached?.text === text)
-      return cached.tokens;
-    const units = estimateTokenUnits(text);
-    const tokens = Math.ceil(units / 4);
-    this.cache.set(key, { text, units, tokens });
-    return tokens;
-  }
-  append(key, delta) {
-    const cached = this.cache.get(key);
-    if (!cached)
-      return;
-    const units = cached.units + estimateTokenUnits(delta);
-    this.cache.set(key, {
-      text: cached.text + delta,
-      units,
-      tokens: Math.ceil(units / 4)
-    });
-  }
-  clear() {
-    this.cache.clear();
-  }
-}
-
 // src/cache-view.tsx
 var DEFAULT_CONTENT_WIDTH = 29;
 var MIN_CONTENT_WIDTH = 20;
@@ -706,7 +777,7 @@ function CacheView(props) {
         return _el$21;
       })(), (() => {
         var _el$22 = _$createElement2("text");
-        _$insert2(_el$22, () => row("TPS", metrics().speed.active ? "\u2026 tok/s" : formatSpeed(metrics().speed.value), contentWidth()));
+        _$insert2(_el$22, () => row("TPS", metrics().speed.active && metrics().speed.value === undefined ? "\u2026 tok/s" : formatSpeed(metrics().speed.value, metrics().speed.estimated), contentWidth()));
         _$effect2((_$p) => _$setProp2(_el$22, "fg", props.theme.textMuted, _$p));
         return _el$22;
       })(), (() => {

package/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
   "name": "@mtayfur/opencode-cache-view",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "Minimal OpenCode TUI sidebar for cache hit, estimated tokens, and generation speed.",
   "repository": {
     "type": "git",