dsh-chat-columns:给 DSH Web 长会话加「报纸式」多列读法

前言

DeepSeek Harness(DSH)的 Web 会话可以拉得很长:一轮里往往夹杂着代码、工具调用和思考过程,但界面默认仍是单列纵向滚动。宽屏两侧留白,回顾几轮之前的结论也要靠滚轮和记忆。DSH 生态里能力一般以插件形式扩展;社区目录 SkillHub 收录了维护者 WuZiyi521 的客户端插件 dsh-chat-columns,目标不是简单「排版好看」,而是让同一段对话能换几种读法。当前可用的是 报纸模式(CSS 多列、共用宿主滚动容器);无缝与复制两种模式在路线图中,尚未实现。

这是什么

dsh-chat-columns 把 DSH Web 会话正文排成报纸式多列:所有列共用宿主唯一的滚动容器,滚动、锚点与「加载更早」仍由宿主负责,插件只负责列宽与分栏逻辑。README 强调这不是给 flex 容器随手加 column-count——宿主 [data-chat-flow] 带 .column 且为 display:flex,CSS 多列对 flex 无效,插件需改回 display:block 并配合调整 --dsh-chat-content-width 等变量。插件无构建步骤,主要逻辑在 lib/client.js。package.json 版本为 0.1.5,许可证 MIT;GitHub 仓库当前星标为 0。

核心功能(以当前版本为准)

下面只列资料中已写明、且报纸模式已实现或验收中的能力。

报纸模式

  • 按滚动容器宽度自动在 1~3 列间切换(自动模式下每列可读宽度下限约 420px)。
  • 支持手动指定 1 / 2 / 3 列或 auto;右下角徽标可点击切换。
  • 所有列共用宿主唯一滚动容器,插件不写 scrollTop。
  • 矮卡片(高度 ≤420px)不被列边界切断;较长消息允许跨列,属报纸读法设计。
  • 滚到顶可触发宿主「加载更早」(需用户自行滚到距顶约 24px,并有防抖)。
  • 多面板场景下尝试识别主会话容器([data-conversation-scroll] 内内容行最多者),仅在容器内选取 flow;分不清时冻结布局并提示。
  • 暗色主题跟随宿主 token;列数写入 localStorage,刷新后保持。
  • 卸载时清理样式、徽标、内联变量、调试 API 与 html 上的 data-dshc* 标记。

计划中、尚未交付的模式

README 将三种读法统一命名为 报纸 / 无缝 / 复制(0.2.0 目标)。无缝侧重一屏一列、接缝连续上移;复制侧重只读副本分栏、各栏独立滚动(受 React 单节点树约束,交互须用静态副本,不能点按钮)。二者当前未实现。

安装与启用

插件归属 web profile。资料中的安装步骤在取得插件本地目录后,用 DSH CLI 加入 bundle(勿自行拼接未在文档出现的 github:owner/repo 形式):

dsh plugin --profile web add "$PWD/dsh-chat-columns"

将 $PWD/dsh-chat-columns 换为你本机上的插件目录绝对路径即可。装完后会进入 ~/.dsh/profiles/web/package.json 的 dsh.profile.bundles;dsh-hmr 在线时通常几秒内热生效,无需重启。若未生效,可重启 web 进程(README 提醒:dsh-web 即当前会话环境,重启会打断当前对话)。

安装前建议自行查看仓库源码与 MIT 许可证:客户端插件随 DSH Web 进程加载,权限与当前 DSH 运行环境一致。

彻底卸载:

dsh plugin --profile web remove dsh-chat-columns

README 另注:配置热重载后若未刷新页面,新实例可能要等下一次布局事件才接管当前会话;启用或重装后刷新一次页面是推荐做法。

典型用法

切换列数

在浏览器开发者工具控制台调用全局调试 API:

__dshChatColumns.set(1)      // 关掉(恢复单列)
__dshChatColumns.set(2)      // 固定两列
__dshChatColumns.set(3)      // 固定三列
__dshChatColumns.set("auto") // 按窗口宽度自动(默认)
__dshChatColumns.get()       // 查看当前状态

偏好保存在 localStorage["dsh-chat-columns:cols"]。

列数计算规则(资料摘录)

自动与手动模式使用固定公式(gap = 40,须与 CSS column-gap 一致):

fit(w) = max(1, floor((W + gap) / (w + gap)))
自动    = max(1, min(3, fit(420)))
手动 n  = max(1, min(n, 3, fit(260)))

列数依据滚动容器 clientWidth;窗口或侧栏变化由 ResizeObserver 监听。

本地开发与沙盒

无构建步骤,修改 lib/client.js 保存后依赖 dsh-hmr 热替换。可用仓库内 harness/index.html 配合本地 HTTP 服务查看多列效果(详见仓库 README「开发」一节)。

适用场景与注意

适合谁: 经常在 DSH Web 里阅读或复盘超长对话、希望宽屏横向利用空间、快速扫读全貌的开发者。报纸模式风险相对低:不接管滚动,与宿主锚点、加载更早的分工较清晰。

应注意:

  1. 当前仅是 CSS column-count 的报纸模式,不是「一屏一页」的无缝阅读。
  2. 页面存在多个 [data-chat-flow](轨迹、子代理等)时,插件依赖主会话容器启发式;多个滚动容器且行数接近时仍可能误判,资料标明未充分验证。
  3. 超宽表格、sticky 元素在多列下的表现资料中标注为未验证。
  4. 移动端未专门适配;420px 列宽下限在手机上通常恒为 1 列。
  5. 维护方 README 写明稳定性处于 0.1.x 验收阶段,不宣称全部稳定性用例通过;细节见仓库 docs/testing.md 与已知限制列表。

结尾

dsh-chat-columns 在插件层为 DSH Web 长会话提供了第一种额外读法——报纸式多列,并预留无缝、复制两种模式的设计空间。若你要试用或跟进版本,可从社区目录与 GitHub 仓库获取说明与源码:

  • 目录页:https://www.skillhub.cn/plugins/WuZiyi521/dsh-chat-columns
  • GitHub:https://github.com/WuZiyi521/dsh-chat-columns

社区目录为独立站点,与 DeepSeek / 幻方无官方从属关系;安装与权限请以你本机 DSH 环境与仓库最新 README 为准。

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

小夜