Introduction

The DeepSeek Harness (DSH) Web GUI is a browser- and Node.js-based integrated environment, commonly used for agent development and model invocation testing. In daily use, accurately tracking daily token consumption is critical for controlling costs, diagnosing abnormally high usage, and optimizing prompts. Currently, DSH’s native interface lacks built-in visual statistics, making manual aggregation or reliance on external scripts cumbersome. For this scenario, the dsh-plugin-token-heatmap plugin provides an intuitive solution.

Plugin Overview

This is a daily token usage heatmap plugin for DeepSeek Harness Web GUI. It displays historical and real-time usage in a floating window, helping users quickly identify usage patterns.

  • Maintainer: P-CAmilE
  • License: MIT

Core Features

This plugin provides the following capabilities:

  1. Dual data views: The floating window supports switching between “Global” (all sessions combined) and “Current Session”.
  2. Historical backfill: On first installation, the plugin automatically scans all historical session logs and includes past data in the heatmap.
  3. Real-time updates: When the window is visible, the system polls data every 3 seconds. The data carries a version number, and updates are triggered only when values change.
  4. Visualization: It uses a five-level blue color scale (the darkest is #396BE2) and categorizes levels based on the quartiles of non-zero days. It supports a vertical grid, displays a 12-month window, and includes a “Back to Latest” shortcut.
  5. Interaction and memory: Supports dragging the floating window; the window position is recorded in localStorage. It also supports show/hide control and adapts to DSH’s light and dark themes.
  6. Summary statistics: Provides data for today, this week, this month, and the 12-month total. Hovering with the mouse displays itemized details such as input, output, and cache reads/writes.

Installation and Enablement

Run the following command in the terminal to install the plugin:

dsh plugin --profile web add dsh-plugin-token-heatmap

After installation, restart DSH Web. A square icon will appear in the bottom-right corner, indicating that the plugin is enabled.

Typical Usage

  1. View data: Click the square icon in the bottom-right corner; the floating window will display the current token usage heatmap.
  2. Switch views: Click the top of the floating window to switch the data source between “Global” and “Current Session”.
  3. Browse history: The heatmap shows the latest week by default; scroll down to view earlier data across the 12-month window.
  4. View details: Hover over a color block to view detailed usage statistics for that day.

Environment and Notes

  1. Runtime environment: The plugin depends on the @deepseek-ai/* runtime (private packages) and can only be installed and used within the DSH environment.
  2. Development dependencies: Local builds require Node.js >= 20 and pnpm.
  3. Data storage: The plugin’s persistent data is stored in the host-side $DSH_HOME/token-heatmap/ directory (i.e., ~/.dsh/token-heatmap/).
  4. Fault tolerance: If the file is corrupted, the plugin starts from an empty state and raises a warning, without crashing the DSH process.
  5. Permission scope: The plugin runs with the permissions of the current DSH process. It is recommended to review its source code and license before installation.

Conclusion

dsh-plugin-token-heatmap provides DSH Web users with a lightweight token tracking tool. Through visual color scales and real-time updates, development costs can be managed more intuitively. For more details and source code, refer to its GitHub repository.