在 DSH Web 会话状态行显示实时输入输出 token 估算与生成吞吐速率,响应流式输出时持续更新。
ⓘ 此插件是大仓库 CAPTAIN1275/dsh-ui-web 的子包,星数与活跃度统计的是整个仓库。
- 语言
- TypeScript
- License
- Apache-2.0
- 分支
- main
安装
$ dsh plugin --profile web add github:CAPTAIN1275/dsh-ui-web/packages/dsh-live-stats在终端中运行以上命令,通过 dsh CLI 安装此插件。可在右上角切换 Profile。 第一次用 dsh?看这篇新手教程
对话式安装
帮我安装 DeepSeek Harness 插件 CAPTAIN1275/dsh-ui-web/packages/dsh-live-stats:先查看仓库 https://github.com/CAPTAIN1275/dsh-ui-web.git 确认安全性,然后执行安装命令并验证插件加载成功。
把这段指令粘贴给 DSH Web GUI 里的助手,由它代你完成安装与验证。
一句话定位
给 DSH Web 的会话状态行加上实时输入/输出 token 估算与生成吞吐速率显示,响应流式输出时数字随 chunks 持续更新,并在 provider 真正返回 usage 时被精确值替换。
核心能力
- 实时估算输入 token:按字符数加块/消息框架折算响应流开始前的输入量,并把系统提示与工具 schema 也计入
- 实时估算输出 token:从
text-delta/reasoning-delta/tool-call-delta流式 chunks 累加,每个新 chunk 触发一次读数刷新 - 自动替换为精确值:当 provider 返回
usagechunk 或最终消息时,立即用真实值覆盖该步骤之前的启发式估算 - 显示生成吞吐 TPS:在会话状态行渲染
TPS 31.4 tok/s形式的吞吐速率,按活跃步骤的输出 token / 墙钟耗时计算 - 常驻速率显示:一旦任何步骤测得吞吐,新步骤在产出首个 chunk 之前、或者遇到无速率步骤时回退到最近一次测得值,状态行不闪烁消失
- 提供设置面板:浏览器端在 Web UI 插件组里挂一个设置卡片,可视化编辑三个估算参数和总开关,修改后无需重启即生效
技术实现
- 语言: TypeScript(peer 依赖 React 18.2,dsh.client.platform="web")
- 关键依赖:
@deepseek-ai/dsh-session-projection(投影宿主)、schemastery(设置 schema 校验)、zod(投影读数边界 schema)、@deepseek-ai/dsh-token-meter(读数类型来源) - 架构模式: Cordis 双向插件。Host 半体注册名为
liveTokenUsage的可重放会话投影(ctx.sessionProjections.register),把估算参数冻结进折叠闭包;客户端半体在conversation.composer.dock槽挂载 TPS 行,在web-ui.plugin.item槽挂载设置卡片 - 入口文件: 宿主侧
src/index.ts(导出inject/Config/apply),客户端src/client/index.ts;纯函数核心在src/estimator.ts(字符密度估算)和src/projection.ts(事件折叠 + TPS 派生)
适用场景
当你在 DSH Web 上让模型做长任务时,只看到最终 token 数会觉得不踏实:这个插件把"模型现在生成多快""这段回答大约多少 token"做成实时读数贴在状态行上,适合需要即时观察吞吐与用量的重度用户,也适合对 KV 缓存成本敏感的工程师用来对比不同模型/参数下的实际速率。
前置依赖与兼容性
| 依赖 | 最低版本 | 说明 |
|---|---|---|
| DSH Web | 0.1.0-rc.6 | peerDependencies 全部钉在 ^0.1.0-rc.6(含 dsh-client-runtime、dsh-client-connection、dsh-client-ui-conversation、dsh-client-ui-settings、dsh-client-ui-slots、dsh-invariants、dsh-llm、dsh-session、dsh-session-projection、dsh-settings、dsh-token-meter) |
| React | 18.2.0 | 客户端卡片与 TPS 行均使用 React 组件 |
| 平台 | 跨平台(macOS / Windows / Linux) | 运行时不限操作系统,但 dsh.client.platform="web",仅渲染在 Web 宿主里 |
| 原生模块 | 无 | 全部逻辑在 TypeScript 与 React 内完成,没有 node-gyp 依赖 |
安装方式
dsh plugin --profile web add github:CAPTAIN1275/dsh-ui-web/packages/dsh-live-stats
安装后重启 dsh web,会话状态行出现 TPS 组;也可作为普通 overlay 行加入 ~/.dsh/config.yaml(保存即热加载):
- insert:
- id: live-stats
name: '@captain1275/dsh-live-stats'
config:
charsPerToken: 4
blockOverhead: 4
roleOverhead: 4
配置项
| 配置 | 类型 | 说明 | 默认值 |
|---|---|---|---|
enabled | 布尔 | 总开关,关闭后停止 token 估算与吞吐追踪,但仍注册投影骨架 | true |
charsPerToken | 数字 | 大约多少个文本字符折算为 1 个 token;中文密度高可调到 1.5 上下 | 4 |
blockOverhead | 非负整数 | 每个内容块(文本/工具调用/工具结果)固定的框架 token 数 | 4 |
roleOverhead | 非负整数 | 每条消息或助手响应固定的框架 token 数 | 4 |
三个估算参数必须在 charsPerToken 是正有限数、blockOverhead 与 roleOverhead 是非负整数时才生效,否则会在加载阶段抛错。设置面板修改后,宿主会丢弃旧投影并用新参数重新折叠会话日志,无需重启 dsh web。
常见问题
Q: 安装后需要重启 DSH Web 吗?
A: 需要。投影注册发生在 host 进程里,安装或卸载后必须重启 dsh web 才会生效;浏览器侧硬刷新不能替代宿主重启。
Q: 它会不会改变实际发送给模型的 token 数?
A: 不会。插件不注入提示段、不注册工具、不发出 session 事件,对模型端每个请求的 token 影响为零,也不会对系统提示的 KV 缓存稳定性造成影响。
Q: charsPerToken 该填多少?
A: 默认 4 字符/token 对纯 ASCII 足够,但对中文会低估。可在设置面板或 ~/.dsh/config.yaml 中下调到 1.5 左右,再观察 ~ 估算与 provider 实际返回值的偏差来微调。
Q: 状态行里数字前面的 ~ 是什么意思?
A: 表示那是按字符数推算的启发式估算。一旦 provider 在流式过程中返回 usage chunk 或最终消息带 usage,估算会被精确值原地替换;中途重试会替换该步骤之前的估算,被中止的回合会移除其未结算估算。
Q: 卸载后需要清理数据吗?
A: 插件本身不持久化任何数据,卸载后下次启动 dsh web 不再注册 liveTokenUsage 投影,会话状态行自动回到未含 TPS 组的样式,无需手动清缓存或数据。
Q: 支持 TUI 或桌面端吗?
A: 暂不支持。当前 TPS 行只渲染在 DSH Web 的会话状态行(composer dock),TUI、桌面端和移动端没有等价显示位置。
上手难度
入门 — 安装一行命令、重启 DSH Web 即可看到效果,三个估算参数都给了默认值;只有发现估算偏差较大时才需要调整。
已知问题与限制
- 启发式估算:
~标记的输入/输出总量在 provider 用量到达前只是字符数近似,精确的缓存命中统计始终来自 DSH 自带的 token 用量投影,本插件不会替代那条权威路径 - 仅 Web:
TPS组渲染在 DSH Web 的 composer dock 内,TUI、桌面端、移动端没有等价显示位置 - 单一活跃步骤:每个会话只跟踪一个活跃步骤,状态行显示该会话视图;并发会话各自拥有独立的投影互不干扰
- 密度假设:
charsPerToken=4对纯 ASCII 高估、对中文低估,若估算偏差明显可按部署微调该值 - 不影响模型体验:插件对模型的提示/工具/事件流零侵入,仅消费持久化事件流做只读渲染
基于 zhu1090093659/dsh-web-ui(Apache-2.0)开发的 DeepSeek Harness(DSH)Web UI 插件套件。全套 22 个包已发布到 npm(
@captain1275/*)。
DSH Web UI 全家桶为 DeepSeek Harness 的 Web 界面提供一系列插件与皮肤:极光毛玻璃皮肤、任务看板、 SSH 运维、右侧文件/变更面板、Git 图谱、移动端远程控制、DeepSeek 娘看板娘(养成系)、实时令牌统计, 以及皮肤中心。所有插件既可独立安装,也可通过聚合包一次装齐。
极光 Aurora 皮肤效果(沉浸光感 / 深色 / 浅色)



特性
极光(Aurora)皮肤(支持动态背景)
- 毛玻璃输入框:高斯模糊(backdrop-filter 30px)+ 半透明玻璃底 + 细边框 + 内高光
- 自定义背景:URL / 本地图片 / 动图(GIF/WebP)/ 视频(mp4/webm) / 透明度 / 模糊调节,
深浅两套极光渐变;视频背景支持静音开关、本地文件持久化(存
~/.dsh/skin-aurora-media/,刷新不丢) - 仿Claude Code推理等级滑块:点击模型菜单的「推理等级」弹出 Effort 滑块面板——无极拖动、松手吸附、 WebGL 火焰跟随、OFF/MAX 刻度、Low/Medium/High/Ultracode 状态

- 用户消息气泡毛玻璃:与输入框统一的玻璃质感
DeepSeek 看板娘(养成系)
- 图片资源(社区同人资源,codex-pet-DeepSeek-girl)
- 养成系统:亲密度 4 级成长(幼鲸 / 伙伴 / 挚友 / 深海羁绊)、升级庆祝气泡、进度条、 Token 零食经济、使用时长成长(每 30 分钟 +1)
- 待机随机气泡:空闲时随机说话(live2d 风格文案)
- 摸头 / 喂食 / 改名 / 拖动,召唤按钮(live2d 同款贴边滑出)
Skill 人格设定
- 设置「人格设定」:开关启用/禁用常驻人格,编辑技能名、描述与人格正文
- 一键生效:保存后写入用户级技能
~/.dsh/skills/catgirl-rp/SKILL.md,DSH 技能系统实时加载, 所有新对话自动以该人格回应(含语气、动作表达、互动规则) - 内置猫娘人格:默认提供「小咪」猫娘人格(常驻生效、好感度系统、模式切换指令),可自由改写
- 可临时退出:对话中说「退出角色扮演模式」即切回普通助手,说「进入角色扮演模式」恢复

用量看板
- 彩色统计卡:累计 token、调用次数、缓存命中、估算费用(按 DeepSeek 官方定价)
- 近 14 天趋势:每日 token 消耗柱状图
- 模型分布:各 provider/model 用量环形图 + 图例
- 会话排行:Top 20 会话(标题 / 模型 / 调用数 / token / 费用)
- 自动记录:对话时自动采集 token 用量(会话快照替换语义,不双计),存
~/.dsh/usage.json - 侧边栏入口:彩色柱状按钮打开全屏看板
功能插件
| 插件 | 功能 |
|---|---|
| dsh-task-board | 侧边栏任务看板:多列 kanban、真实执行(驱动 agent 会话)、定时执行(cron) |
| dsh-ssh | SSH 运维:主机管理、远程执行、SFTP 传输、隧道、集群并发、Web 终端 |
| dsh-aionui-panel | 右侧「预览 / 文件 / 变更」面板:文件树、多格式预览、git 操作、文件拖拽 |
| dsh-git-graph | 会话头部 git 分支选择器 + 提交图 |
| dsh-live-stats | 实时 token 估算与生成速度 |
| dsh-full-stats | 完整统计行:覆盖官方统计(不省略)+ 运行状态指示 + 自定义状态文本(含替换官方 Deep diving...) |
| dsh-usage-dashboard | 用量看板:彩色统计卡 / 近 14 天趋势 / 模型分布 / 会话排行 / 费用估算 |
| dsh-web-ui-settings | 设置页「Web UI 插件」配置组 + 「人格设定」+「关于」版权页 |
| dsh-web-ui-all | 聚合包:一键安装全部插件 |
皮肤中心
10 套皮肤(ths / xp / blue-fantasy / dragon-heir / minecraft / miku / trading / whale-song / aurora / skin-center),支持皮肤启用互斥管理与一键切换。
其余皮肤(ths / xp / blue-fantasy / dragon-heir / minecraft / miku / trading / whale-song) 为上游 dsh-web-ui 自带皮肤。
安装
方式一:npm(推荐,已发布)
# 在 DSH profile 目录(~/.dsh/profiles/web)安装聚合包
npm install @captain1275/dsh-web-ui-all@0.2.8
然后在 profile 的 package.json 里把 @captain1275/dsh-web-ui-all 加入
dsh.profile.bundles:
{
"dsh": {
"profile": {
"bundles": [
"@deepseek-ai/dsh-base",
"@deepseek-ai/dsh-web-app",
"@captain1275/dsh-client-ui-skin-aurora",
"@captain1275/dsh-full-stats",
"@captain1275/dsh-web-ui-all"
]
}
}
}
重启 DSH 即生效。
方式二:从源码(开发)
git clone <your-repo-url> dsh-web-ui
cd dsh-web-ui
pnpm install
pnpm -r build
# 把本地包链接进 profile(junction)
node scripts/link-profile.mjs
开发
- 构建:
pnpm -r build(或pnpm --filter <package> build) - 新增皮肤:参考
packages/skins/aurora(skin.json+src/client+cordis.patch.yml), 然后用node scripts/skin-center-bundles重新生成注册表 - 聚合包 patch:编辑
packages/dsh-web-ui-all/aggregate.yml后node scripts/aggregate.mjs - 皮肤资产同步:
node packages/dsh-skins/build.mjs
目录结构
packages/
├─ dsh-task-board / dsh-ssh / dsh-aionui-panel / dsh-git-graph
├─ dsh-pet / dsh-live-stats / dsh-full-stats
├─ dsh-web-ui-settings / dsh-web-ui-all / dsh-skins
└─ skins/ # 皮肤源码(aurora、miku、ths 等)
scripts/ # 构建 / 注册表 / 链接工具
shared/ # 共享构建预设(tsdown.client.ts)
版权与许可
- 主体代码:zhu1090093659/dsh-web-ui,Apache-2.0
- 增强优化:@captain1275
- DeepSeek 娘精灵图:xpy12367/codex-pet-DeepSeek-girl, 社区同人资源,版权归原作者
- 人形图标:Font Awesome 6.7.2,CC BY 4.0
- 样式参考:live2d-widget(GPL-3.0,仅参考视觉风格,未搬用代码)
- 商标:DeepSeek 及其相关标识均为 DeepSeek 官方资产;本插件为社区开发者独立维护的非官方同人项目, 不代表 DeepSeek 官方立场。
收录徽章
[](https://deepseek-plugin.org/plugins/CAPTAIN1275/dsh-ui-web/packages/dsh-live-stats)把这段 markdown 粘贴到你的 GitHub README,链接回本插件详情页。徽章只声明已被本站收录,不代表安全认证。