Laplace-bit/dsh-smooth-stream
dsh-smooth-stream
DeepSeek Harness Web UI plugin for streaming rendering and scroll handling.
Install
npx @deepseek-ai/dsh plugin --profile web add dsh-smooth-streamRestart `dsh web` after install. Bundle APIs can change during the developer preview.
README badge
[](https://dshhub.dev/plugins/dsh-smooth-stream)Paste this into your README. The star count updates with every catalog sync.
From the README
Excerpt from Laplace-bit/dsh-smooth-stream, cleaned of badges and images.
dsh-smooth-stream
让 AI 的长篇生成如提词器般温润流淌。
为 DeepSeek Harness(dsh)打造的二阶弹簧物理流式渲染与零重排跟随引擎。
English · 项目主页 · 工作原理与基准 · npm
极致丝滑的阅读手感
无论是阅读数百行的长篇推演,还是紧盯高速吐字的代码生成,dsh-smooth-stream 带来的是一种沉浸、连贯且零视觉负担的阅读质感:
- 如水流般自然铺展:告别大段文本突然“砸”在屏幕上的视觉压迫,字句如打字机般富有呼吸感地逐字涌现;
- 视线无需追赶跳动:视口如同搭载了高精度阻尼滑轨,随文字增长平稳匀速推移,彻底终结换行时的突发踢移;
- 呼吸感与实时性的平衡:慢速输出时从容优雅,高并发爆发时平稳追赶,无论模型吐字多快,画面始终从容自若。
为什么需要它?
大模型输出是通过网络分块到达的。一个数据包可能在几毫秒内送达数百字符,下一个分块却需要数十毫秒。
如果直接将 DOM 渲染和视口滚动绑定在离散的到达事件上,通常会引发两个阅读体验问题:
- 视觉跳跃与撕裂:段落、代码块和表格整段突发呈现,视线被迫频繁重新寻焦;
- 滚动抖动与重排风暴:依靠
scrollTop = scrollHeight进行瞬时硬跳;即使用 CSSscroll-behavior: smooth,高频写入也会不断重置缓动曲线,导致动画永远无法收敛,高速流下伴随剧烈的主线程重排。
dsh-smooth-stream 将内容呈现与视口运动拆分为两个独立的物理状态机,在每一帧动画回调(rAF)中连续积分,彻底消除跳跃感。
核心机理与架构
[ 模型 SSE 分块流 ]
│
▼
┌─────────────────┐ 背压阻尼 (0.55x ~ 1.0x) ┌─────────────────┐
│ 揭示节奏引擎 │ ◄──────────────────────────────── │ 弹簧跟随引擎 │
│ (Reveal Engine) │ │ (Follow Engine) │
└────────┬────────┘ └────────┬────────┘
│ 字符积压与分数积分 │ 二阶阻尼弹簧积分 (k=130, c=24)
▼ ▼
[ 逐帧平滑展开 DOM ] ───────────────────────────────► [ 合成层 Transform 补偿 ]
(单帧视觉位移 ≤ 8px) (0 Reflow / 纯 GPU 合成)
1. 动态自适应的揭示引擎(Reveal Engine)
- 分数级字符积分:根据积压队列深度自适应调节速度($v = 90 + \text{backlog}^{1.25} \times P$),低负载时从容自然,高积压时平稳追赶,绝不倾泻整段文本。
- 折行限幅平滑:长文本和代码块发生换行时,单帧视觉位移被限制在 8px 以内,将原本 24~28px 的单帧跳跃平摊至数帧完成。
- 尾部平稳收束:回合结束标记到达后,残余缓冲区以恒定速率释放,正文、思考链与工具调用之间自然衔接。
2. 纯合成层驱动的跟随引擎(Follow Engine)
- 二阶阻尼物理系统:采用 $k=130, c=24, m=1$ 的亚步进物理弹簧,将内容高度的变化转化为平滑连续的速度与位移轨迹。
- 零重排(Zero-Reflow)位移补偿:真实滚动容器始终锚定在底部,剩余的视觉滞后完全由外层 DOM 的
transform: translate3d吸收。跟随过程不读写任何触发 Layout 的属性,杜绝重排风暴。 - 闭环背压控制(Closed-Loop Backpressure):当跟随滞后接近预留空间时,反向向揭示引擎施加阻尼(最低降至 0.55 倍速),防止文本增长超出视口弹簧范围。
- 掉帧自愈与跨刷新率一致:主线程卡顿(Stall)时自动钳位物理时间($\le 32\text{ms}$),避免画面恢复后的突进瞬移;在 60Hz 与 120Hz(ProMotion)屏幕下拥有近乎一致的物理收敛时间。
3. 会话生命周期自动折叠(Turn Auto-Collapse)
- 对话进行时,思考链与工具调用保持实时展开;
- 回合结算完成并稳定后,自动将执行过程收敛为一行极简的
已处理 X 秒摘要,保持工作区专注;支持随时点击无缝展开。
效果对比
左:默认 Web UI。右:dsh-smooth-stream。
性能与基准
平滑度与稳定性基于本地自动化审计台架验证:
| 验证闸门 | 测试项目 | 指标要求 |
|---|---|---|
| 流式渲染审计 | node scripts/run-render-audit.mjs | 5 种典型生成场景下 10/10 Clean,零位移回退 |
| 视口溢出闸门 | node scripts/verify-overflow.mjs | 极限输出场景下零过滚、零反弹 |
| 尾行晃动抑制 | pnpm test | 单帧跳变 ≤30px,7 帧振幅峰值 ≤32px |
- 核心 ESM 产物经 Gzip 压缩后仅约 4.7 kB。详见工作原理与基准。
安装与使用
在 DeepSeek Harness 源码根目录运行:
pnpm dsh plugin --profile web add dsh-smooth-stream
如果系统 PATH 中已有 dsh:
dsh plugin --profile web add dsh-smooth-stream
启动界面:
pnpm dsh web
Host 日志中显示 [dsh-smooth-stream] plugin loaded! 即表示已成功加载。
卸载命令:pnpm dsh plugin --profile web remove dsh-smooth-stream。
内核兼容性
…

