前言¶

在 DeepSeek Harness（DSH）里用 AI 改 HTML，右侧侧边栏的浏览器标签页往往只负责「显示结果」。页面从空白到有内容的过程，对用户和协作者来说都是瞬间完成的，缺少一种「正在施工」的可视反馈。Swarm Rebuild（仓库名 Multi-agent-development-dynamic-effect，npm 包名 dsh-swarm-rebuild）是维护者 lanyuxi 提供的 Cordis 插件，把工作区里正在被 AI 编辑的那一页，在预览里用 8–48 个协作式光标从蓝图状态一块一块搭回去，搭完退场，不污染磁盘上的源码。下面介绍它解决什么问题、怎么装、以及运行时要满足的前提。

这是什么¶

Swarm Rebuild 是一个由主机侧（index.js）、客户端侧（client.js）和注入页面的 runtime（runtime.js）组成的 DSH 插件。它不是单独的演示站：跑的就是 AI 当前在工作区里写的那份 HTML。动效只在 AI 修改、新增或删除页面内容后重播一次，不会无限循环。

分类上可归入「工作流」——把「开发中的页面」和「侧边栏 live 预览」接在一起，用动效提示「这一版页面刚被 AI 动过」。

核心功能与效果¶

经过上面的定位，可以把可见能力归纳为以下几点（均来自项目 README 对效果的描述）：

1. 蓝图开场：页面整体淡成蓝图；顶部和左侧出现带刻度的深色标尺；站点图标停在画面正中；约 18 个光标绕图标游动一圈后散开，各自认领页面上的一个块。
2. 块级搭建：十字光标拖出 1px 蓝色选框，块随选框生长；选框下浮出如 240 × 96 的尺寸徽章；标尺高亮对应区间；蓝色虚线参考线、红色测量参考线会吸附并闪烁。
3. 文本与编辑：文本块切换为 I 形光标，逐字打出真实文字（含词间与随机「思考」停顿）；钢笔线、复制与换样式等编辑动作也会出现；完成的块转为实心并露出真实颜色。
4. 并发与收尾：同时约有 8–48 个光标在工作，页面越复杂并发越高。最后一块完成后，光标聚合成群绕一圈后飞出，蓝图淡出，只留下干净成品——无叠加层、无标尺。同一预览 URL 在外部浏览器打开也会呈现相同效果。
5. 自动重播：主机提供覆盖被监视 web 资源的版本指纹（/__version）；页面内 runtime 轮询指纹，AI 编辑后会自动再播一遍。

runtime 为零依赖实现：不使用 chrome.* API，无音频；通过克隆 DOM 做快照，而非截图。动效引擎设计来自 DhvanilPatel 的 swarm-cursors，本仓库将其接入 DSH，并增加内存预览注入、侧边栏自动打开与参考线合成等接线。

工作原理（简要）¶

先做路由，再做客户端与 runtime 的配合：

• 内存预览路由：主机在 Harness 的 web server（ctx.webServer）上注册前缀 /__dsh_swarm_rebuild__，服务工作区文件；对 HTML 仅在内存注入指向 runtime.js 的 <script>，不写盘，避免污染源码或破坏 AI 的文件版本守卫。
• 版本与端口：/__version 供 runtime 轮询；/__endpoint 返回 loopback 上另一端口的同一预览地址，供内置浏览器标签页避开 GUI 同端口限制。
• 客户端：每个会话默认在右侧侧边栏浏览器标签页打开预览（带成功闩锁，避免重复开 tab）；并通过 /__endpoint 解析端口，把主机内置的 format-1 市场索引注册进 pluginMarket.setIndexes()。
• 可选根目录：环境变量 SWARM_REBUILD_ROOT 可指定预览网页所在目录；默认取已安装插件目录的上一级（工作区根）。

package.json 声明版本 3.2.0，许可证 MIT。

安装与启用¶

这是一个本地 / git 插件，尚未发布到 npm。需要把仓库放进 DSH 工作区，再从该目录安装 bundle。官方 README 给出的步骤如下：

git clone https://github.com/lanyuxi/Multi-agent-development-dynamic-effect.git
# 也可以直接把已克隆的仓库复制进工作区

# 从仓库目录安装 bundle（或在 DSH 插件界面里选择同样的目录）
plugin_manager install_bundle /absolute/path/to/Multi-agent-development-dynamic-effect

装好后插件默认启用。打开任意 AI 会话后，右侧侧边栏浏览器标签页会自动打开预览；AI 写入 HTML 后，动效在预览中播放。

验证是否生效：侧边栏能看到页面，或「正在等待 AI 生成网页…」的等待页，说明主机侧路由已起来；让 AI 写一个 HTML 文件，页面应自动刷新并开始搭建。

环境要求：需要暴露了 web server 服务（ctx.webServer）和侧边栏浏览器标签页的 Harness 构建。预览须允许 JavaScript；禁用 JS 时只能看到静态页，看不到动效。

装好后插件也会出现在 Plugins → Discover（主机路由 /__dsh_swarm_rebuild__/market/index.json）；官方社区目录 PR 尚未提交，他人还无法在社区目录站内搜到该插件（见仓库 docs/PUBLISH.md）。

典型用法¶

典型流程不需要额外配置文件：

1. 在工作区安装 bundle 后保持插件启用（默认即启用）。
2. 在 DSH 中开启 AI 会话，确认右侧侧边栏预览 tab 已打开。
3. 让 AI 在工作区内创建或修改 HTML（及关联的 CSS、JS、图片等被监视资源）。
4. 观察预览：首次有 HTML 后开始搭建动效；之后每次 AI 改动资源，待版本指纹轮询（约数秒）后自动重播。

若只希望预览某一目录下的站点，可在启动 Harness 前设置：

export SWARM_REBUILD_ROOT=/absolute/path/to/your/web/root

未设置时预览根目录为插件安装目录的上一级。

适用场景与注意¶

适合谁：在 DSH 里频繁让 AI 搭落地页、组件 demo 或静态站原型，且已使用「侧边栏浏览器预览」工作流的人；动效能向旁观者直观展示「这一页刚被改过」，而不必单独录屏或开设计工具。

运行与安全：插件以当前 DSH 进程权限运行，会在本机 web server 上注册路由并在预览 HTML 中注入脚本。安装前应阅读仓库源码与 MIT 许可证，确认符合你的安全与合规要求。主机仅对工作区（或 SWARM_REBUILD_ROOT 指定目录）内的文件做服务与指纹计算，不改变磁盘上的 HTML 内容。

常见问题（摘自文档）：

• 侧边栏长期显示「正在等待 AI 生成网页…」：工作区尚无 HTML，等 AI 写出第一个页面即可。
• 端口已停止 / 加载失败：预览端口变化时，重新打开预览或重启 Harness；客户端会重新请求 /__endpoint。
• 改了页面没重播：稍等指纹轮询；确认改的是被监视的 web 资源。
• 完全看不到动效：检查预览是否允许 JavaScript。

结尾¶

Swarm Rebuild 把「AI 正在写的那个文件」和「群蜂式多光标搭建动效」绑在 Harness 侧边栏预览上：内存注入、版本指纹自动重播、不写盘。若你在 DSH 里做前端智能体开发，又希望每一次 AI 改页都有可见的「施工」反馈，可以按 README 用 plugin_manager install_bundle 从本地仓库安装。

• 社区目录页：https://www.skillhub.cn/plugins/lanyuxi/Multi-agent-development-dynamic-effect
• 源码与说明：https://github.com/lanyuxi/Multi-agent-development-dynamic-effect