kelemiao/dsh-animation-optimization 预览 preview

kelemiao/dsh-animation-optimization

Plugin插件 Native原生 ⭐ 6 UI & Themes界面与主题

给 DeepSeek Harness 用的客户端插件。它把 Claude Code 风格的外观带进网页界面,同时把思考块和工具输出的展示方式改造成更像实时流的样子。

catalog descriptioncatalog 简介 / catalog description:DSH 动画优化:输出流式动画与 Claude Code 风格外观插件

Project Overview项目介绍

This is a client-side plugin built exclusively for DeepSeek Harness, designed to add streaming animations to thinking blocks and tool output, while offering an optional Claude Code-inspired appearance for the DSH web UI. Unlike DSH’s default behavior that delivers all tool results at once, this plugin splits output into sequential chunks that animate into view, and manages the open/close state of content blocks automatically. All changes are injected at runtime and do not modify core DSH code; removing or disabling the plugin restores DSH to its original appearance and behavior. To install, run the dsh plugin --profile web add command pointing to the local repo path, and the plugin registers automatically without manual cordis config edits.

It is targeted at DSH users who prefer the interaction and appearance style of Claude Code. After installation, you need to restart the dsh web process and hard-refresh your browser for the plugin to take effect. By default, the full set of Claude-style features are enabled, including color palette, font stack, and the Claude starburst logo. If you only want the animation improvements and do not want to change the original DSH appearance, you can turn off the color and font options in DSH settings, and the animation behavior will remain unchanged. All settings are stored in your browser’s localStorage and take effect immediately after toggling a switch.

The plugin is compatible with both DSH 0.1.0 and 0.1.2, using compatible selector sets and fallback loading for the settings store to support both versions. All animations only modify the transform and opacity CSS properties, play once and do not loop; long output is capped at ~3.8 seconds total to avoid delaying the next content block. The project is released under the open-source MIT license, and includes unit tests that run against a virtual DOM, so you do not need a browser to run the test suite with npm test. If you previously manually registered the plugin, you must remove the old entry from cordis.patch.yml before installing to avoid duplicate mounts.

这是一款专为DeepSeek Harness打造的原生客户端插件,核心功能是优化界面动画效果,同时提供可开关的Claude Code风格外观选项。它将DSH后端一次性推送的工具结果和思考内容改为流式分段播放,自动管理内容块的展开收起时机,所有修改均在运行时注入,不改动DSH本体,关闭插件后界面即可恢复原样。安装可通过dsh plugin命令完成,插件会自动注册配置,无需手动修改cordis.patch.yml。

面向偏好Claude Code交互风格的DSH用户,安装完成后需要重启dsh web并强制刷新浏览器即可生效。插件默认开启全套Claude风格配置,包含配色、字体和logo,如果只需要动画优化不需要外观改动,可以在DSH设置中关闭外观相关选项,行为层动画不受影响。用户可自由组合配置,所有设置都保存在浏览器localStorage中,点击开关立即生效。

插件同时兼容DSH 0.1.0和0.1.2版本,通过适配两套选择器和容错加载设置存储实现跨版本兼容。所有动画仅修改transform和opacity属性,单次播放不循环,长内容输出总耗时封顶约3.8秒,避免延迟下一个内容块。项目采用MIT许可证开源,自带基于虚拟DOM的单元测试,可通过npm test运行,无需浏览器环境。

Pre-install check安装前体检Compatibility · Security兼容性 · 安全性 2 warnings2 项注意
  • No license declared - all rights reserved by default; ask the author before commercial use or redistribution未声明开源许可证 —— 默认「保留所有权利」,商用或再分发前先问作者
  • Only 6 stars - very few users, little community feedback星标只有 6,几乎没人在用,遇到问题缺少社区反馈
DSH walks through these 9 checksDSH 会逐条核对这 9 项

Compatibility兼容性

  • DSH, Node, OS and profile requirementsDSH 版本 / Node 版本 / 操作系统 / profile 是否满足要求
  • External dependencies and runtimes (Electron / Python / Docker, ...)外部依赖与运行时(Electron / Python / Docker 等)是否齐备
  • Conflicts with installed plugins: command names, skill / tool names, ports, duplicate MCP registration与已装插件是否冲突:命令名、skill / tool 重名、端口占用、重复 MCP 注册

Security安全性

  • Repo matches the facts registered here; archived or abandoned?仓库是否与页面登记一致,是否归档或长期停更
  • Safety of preinstall / install / postinstall and install.sh / setup.ps1preinstall / install / postinstall 与 install.sh、setup.ps1 是否安全
  • curl|bash, download-then-execute, obfuscation, unrelated domains → stop immediatelycurl|bash、下载即执行、混淆代码、无关域名 → 立刻停止
  • Typosquatting or unmaintained packages among the new dependencies新增依赖里有没有 typosquatting 或无人维护的包
  • Requested permissions vs. what the feature actually needs申请了哪些权限、是否超出功能所需(filesystem / network / shell / clipboard)
  • Any sudo / admin requirement, plus uninstall and rollback是否要求 sudo / 管理员权限,以及卸载与回滚方式

Anything uncertain must be marked unknown with a note on how to confirm it. This site's signal screen is a static snapshot, not a security audit.拿不准的必须标「未知」并说明要我怎么确认。本站的信号筛查是静态快照,不能替代安全审计。

Or use CLI install (for developers)或使用命令行安装(适合开发者)

CLI Install命令行安装

dsh plugin --profile web add github:kelemiao/dsh-animation-optimization

把 kelemiao/dsh-animation-optimization 加入你的 DSH 配置(web profile)即可启用。

READMEREADME

dsh动画优化

给 DeepSeek Harness 用的客户端插件。它把 Claude Code 风格的外观带进网页界面,同时把思考块和工具输出的展示方式改造成更像实时流的样子。

DSH 后端把工具结果一次性送到页面,这个插件在显示层把它们分段播放出来。文字逐段出现,滚动跟着新内容走,块在开始运行时自动展开,在下一条内容真正出现时才收起。所有效果都在运行时注入,不会修改 DSH 本体。关掉插件,界面就回到 DSH 原来的样子。

截图

Claude 配色界面

Claude 配色界面

DSH 原版配色界面

DSH 原版配色界面

思考中的动画

思考中的动画

改了哪些动画

思考和 pwsh、edit、write 工具在运行时会保持四行高的视口。视口用缓动曲线跟随最新内容,底部有透明度渐隐。用户真正向上滚动时自动跟随会暂停,不会和阅读抢控制权。

工具输出的行按两行一段出现,段与段间隔 140 毫秒,每行用 0.5 秒的透明度和位移过渡进入。长终端输出会以每行 12 毫秒继续,整体封顶在 3.8 秒左右,这样下一块的收起不会被无限拖住。最快的 edit 和 write 调用往往在状态已经变成完成后才渲染出内容,这种情况同样会走分段播放。

思考块和工具块在进入运行状态时自动展开一次。结束后先保持展开,等文档流里的下一条内容真正挂载出来才播放关闭动画。没有超时兜底,不会在下一项还没出现时提前收起,也不会随便等一个固定秒数。运行时的 96px 视口钳制会保留到关闭动画结束,避免整段内容闪现一帧。

打开和关闭动画都只动 transform 和 opacity,一次播放,不循环。

外观

暖米色底、墨色文字和黏土色强调色来自颜色 token 层。标题、路径和引用使用衬线字体,来自字体层。Claude 星爆头像和思考指示器由 logo 层控制。三个层互相独立,可以只保留 Claude 字体而用 DSH 原版配色,反过来也可以。

插件默认开启完整 Claude 全套:配色、字体、logo 都是开着的。如果只想要动画优化、不想要外观改动,在设置里关闭 Claude 配色和 Claude 字体即可,展开收起、流式输出、自动跟随这些行为层动画不受影响,界面会回到 DSH 原版外观。

安装

dsh plugin --profile web add link:C:/path/to/dsh-animation-optimization

插件声明了 dsh.bundle.patch,dsh plugin 装好后会自动把它加入 dsh.profile.bundles,不需要手动改 cordis.patch.yml。

重启 dsh web,浏览器强制刷新一次。如果之前手动注册过 dsh-theme-photo-editorial 或 dsh-animation-optimization 的 insert 行,先把它从 ~/.dsh/profiles/web/cordis.patch.yml 里删掉,避免同一插件挂载两次。

设置

插件在 DSH 设置里注册了三个开关,通用设置里各有一条紧凑入口,Photo Editorial 主题分区页里有完整三行。

Claude Logo 控制星爆头像和流式指示器。Claude 配色在编辑风格配色和 DSH 原版 token 之间切换,暗色模式同样适用。Claude 字体在衬线字体和 DSH 默认字体栈之间切换。三个选择都存在浏览器 localStorage 里,点击后立即生效。

结构与测试

宿主侧 lib/index.js 是无逻辑的 cordis 入口。客户端 lib/client.js 是单个无构建步骤的 bundle,运行时注入三层样式(行为、颜色 token、字体),并通过 MutationObserver 驱动展开收起状态机。v31 起同时兼容 DSH 0.1.0(QWLzlG/_Xvjua)与 0.1.2(lcKema/_5OnbHa/EvIC1a)两套选择器;v32 起 settings store 改用容错 require(新版 @deepseek-ai/dsh-client-store 优先,老版 dsh-client-runtime/client 兜底)。测试在 test/client.test.js,用 VM 假 DOM 运行,不需要浏览器。

npm test

License

MIT


dsh animation optimization

A client-side plugin for DeepSeek Harness that brings a Claude Code-inspired look to the web UI and presents thinking blocks and tool output as a live stream instead of finished blocks.

Showing the opening section of the README — the full document lives in the repository以上为 README 开头摘要,完整文档在仓库内 · View the full README on GitHub →在 GitHub 查看完整 README →

← 上一个 Prev dsh-prompt-setting 下一个 Next dsh-tool-stat →