夜雨聆风上期回顾：第一期聊了 dsh-genui，让 AI 在对话里直接画出可交互的前端界面。没看过的建议先翻翻，DSH 的插件体系是连着的。今天第二期，换个方向，聊一个更"重"的插件：它不负责生成内容，但它管的是你怎么跟 DSH 打交道。
上一期聊 genui 的时候，有读者后台问："驴哥，DSH 默认界面太素了，对话归对话，但我想直接看文件、改代码、跑终端，就得来回切窗口，有没有插件能把这些东西拢一块儿？"
有。这期就聊它，dsh-better-sidebar。
一、先说痛点：DSH 默认界面，差在哪了？
DSH 打的旗号是"一切皆插件"，Agent 能力确实猛。但默认 UI 走极简路线，一个对话框打天下。你跟 Agent 说"看看项目结构"，它回你一串文件树文本；你说"改一下这个文件"，改完你得下载下来看；你说"跑个命令验证一下"，跑完输出贴在对话里。
能用吗？能用。好用吗？不太行。
我自己用下来，最难受的就三件事：
驴哥吐槽
DSH 刚出来的时候驴哥就一个感觉：这引擎是真猛，这方向盘是真没有。Agent 能力再强，交互层跟不上，就像给你一辆法拉利但只有油门没有刹车。dsh-better-sidebar 就是来补方向盘和仪表盘的。
二、dsh-better-sidebar 是什么？
omdsh-dev 团队做的 DSH 界面增强插件。一句话说清楚：
文件管理、代码编辑、Markdown 预览、浏览器、终端、Git 状态、后台任务，全收进侧边栏和底部面板。DSH 从纯对话框变成一个能干活的工作台。
而且它不只是往侧边栏塞东西。v0.4.0 之后搞了个服务化设计，暴露了 ctx.betterSidebar 接口，别的插件可以往里面注册自己的 Tab 和文件预览器。说白了它不只是个工具，更像是给 DSH 生态搭了个 UI 底座。
▲ dsh-better-sidebar 完整工作台：左侧对话和文件树、右侧多 Tab 编辑器、底部终端，一屏看完
驴哥心得
第一次看到这张图我以为是 VS Code 截错了图。但仔细看，左侧栏是 DSH 的对话流，不是纯文件树。它把"跟 AI 对话"和"传统 IDE 操作"拼到了一个界面里，这种混合工作台的模式目前只在 DSH 生态里见过。
三、十个功能模块，挑几个说
README 翻了个底朝天，提炼出 10 个功能模块，每个独立可用、按需加载：
📁文件管理器：完整文件树，新建/重命名/删除/拖拽上传都有，右键菜单也齐
📝代码编辑器：基于 CodeMirror 6，多语言语法高亮，Ctrl/Cmd+S 原子保存
👁️Markdown 预览：实时渲染 Markdown，表格/代码块/图片都能正常出
🌐内置浏览器：沙箱 iframe 预览 HTML/网页，Agent 生成的页面直接看效果
🖥️集成终端：xterm.js + node-pty 真实终端，每会话上限 3 个，支持多开
📊Git 面板：源代码管理视图，改动、暂存、提交记录都能看
📋任务管理：后台运行的任务可视化列表，Agent 跑的长任务进度实时可见
🖼️图片预览器：点击图片文件直接在 Tab 中预览，支持缩放
📄Office 预览：Word/Excel/PPT 文件预览，按需加载 Office 渲染引擎
🔌服务化扩展：ctx.betterSidebar 服务接口，第三方插件可注册 Tab 和预览器
功能列表不逐个念了，挑几个实际用着爽的聊。
3.1 代码编辑器：CodeMirror 6 + 原子保存
编辑器用的 CodeMirror 6，目前 Web 端代码编辑器里最能打的之一（Zed 编辑器也用同源技术栈）。多语言语法高亮、行号、自动缩进都有。我比较在意的是保存机制：Ctrl+S（Mac 是 Cmd+S）直接写到 DSH 工作区文件系统，不丢内容，也不产生临时文件。
实际用起来什么感觉呢，你跟 Agent 说"帮我生成一个 React 组件"，生成完直接在侧边栏 Tab 里打开、改、存，不用下载到本地再传回去。整个过程不用离开 DSH 界面。
3.2 集成终端：真实的 node-pty，不是假终端
很多"集成终端"其实只是把命令输出贴到页面上，敲命令还得走对话框。dsh-better-sidebar 的终端是真的，xterm.js + node-pty，你可以在里面直接敲 npm install、git status、python script.py，跟本地终端没什么区别。
每会话最多 3 个终端 Tab，防资源吃满。我日常够用，一个跑 dev server，一个 git 操作，一个跑临时命令。
驴哥吐槽
之前用 DSH 的时候，想确认 npm install 装没装成功，得跟 Agent 说"帮我查一下 package.json"。现在直接开终端自己敲 npm ls，三秒的事。方向盘还到驾驶员手里的感觉。
3.3 内置浏览器：沙箱 iframe 安全预览
Agent 给你生成了一个 HTML 页面，想看效果怎么办？以前只能下载到本地再浏览器打开。better-sidebar 直接内置了一个浏览器，在 iframe 沙箱里加载页面，隔离运行。
这个功能配 dsh-genui（第一期聊的那个）用起来太爽了。genui 生成交互界面，better-sidebar 在浏览器 Tab 里直接预览，不满意当场改，改完刷新看效果。两个插件一搭，DSH 基本上就是个在线版 VS Code。
驴哥心得
genui + better-sidebar 的组合是我目前用过的 DSH 插件里最搭的。一个管生成，一个管操作。建议两个一起装。
四、双工作台：右栏加底栏，Tab 可以拖来拖去
better-sidebar 不是只加了个侧边栏，它搞了两块工作区：右侧栏加底部面板，都支持多 Tab，而且 Tab 能跨面板拖。
啥意思呢，你在右侧栏开了代码编辑器、文件管理器、Markdown 预览三个 Tab，觉得挤，直接把终端 Tab 拖到底部面板，上面看代码下面跑终端。反过来也行，底栏的 Tab 拖回右栏。
▲ 三栏工作台实战：左侧对话流和任务轨迹、中间 README 预览、右侧资源管理器+Git+任务管理、底部终端
这张截图东西不少，但摆得挺清楚：
驴哥心得
Tab 跨面板拖拽是我觉得最顺手的设计。写代码时编辑器放右栏全屏，跑命令时终端拖到底栏宽屏看日志，一拖就完事，不用关了再开。Web 端工作台里能做到这个灵活度的，不多。
4.1 会话隔离：你的布局只属于你
一个容易被忽略但挺重要的设计：布局状态按会话隔离。你在 A 会话开了三个 Tab，切到 B 会话是默认布局，回到 A 又恢复成你之前的样子。Tab 状态、面板位置、展开折叠都存在 localStorage 里。
你可以给不同任务设不同布局。写代码的会话满屏编辑器加终端，做文档的会话满屏预览加文件树，互不干扰。
五、服务化扩展：不只是工具，是底座
前面提过，v0.4.0 起 better-sidebar 暴露了 ctx.betterSidebar 接口。这是我觉得这个插件设计上最有想法的地方。它不打算自己把所有功能做完，而是让侧边栏变成了一个开放底座，别的插件可以直接往里注册 Tab 和预览器。
第三方插件拿着这个接口能干两件事：
▲ 设置页"侧边卡片"：8 个内置模块 + 6 个文件预览器 + 第三方注册入口
设置页截图能看到，内置 8 个模块（文件管理器、编辑器、Markdown 预览、浏览器、终端、Git、任务管理、设置）和 6 个文件预览器（文本、Markdown、图片、Office、PDF、代码）。每个能单独开关，不用就关掉。
驴哥锐评
服务化这个设计是分水岭。没有它，better-sidebar 充其量是个功能集合，再强也就那样。有了它，别的插件不用自己造侧边栏轮子，直接往里注册 Tab 就行。跟 VS Code 的 Sidebar View API 是一个路子：做底座，让生态往上面长。
我判断，以后 DSH 生态里偏重型的插件，大概率都会依赖 better-sidebar 当 UI 宿主。这插件的天花板不止现在看到的这些。
5.1 懒加载：启动只拉 325KB
功能这么多，会不会拖慢 DSH 启动？不会。better-sidebar 的懒加载做得比较狠：
- 启动时
：只加载核心框架（~325KB），侧边栏骨架秒出 - 代码编辑器
：第一次打开代码文件时才加载 CodeMirror 6 - 终端
：第一次点击终端 Tab 时才加载 xterm.js + node-pty - Office 预览
：第一次打开 Office 文件时才加载渲染引擎 - 浏览器
：第一次打开浏览器 Tab 时才初始化 iframe 沙箱
用不到的功能就是零加载。这设计挺克制的。
六、安装：一行命令
DSH 对话框里直接敲：
# 安装 dsh-better-sidebar/plugin installdsh-better-sidebar
想手动装也行：
# 克隆到 DSH 插件目录git clonehttps://github.com/omdsh-dev/DSH-better-sidebar.git ~/.dsh/plugins/dsh-better-sidebar # 重启 DSH 即可生效
▲ DSH 添加插件弹窗：搜 dsh-better-sidebar 一键装
提示：装完去设置页看看"侧边卡片"，用不到的模块关掉。比如不做 Git 操作就把 Git 面板关了，侧边栏干净不少。
6.1 快捷键
装好之后这几个值得记一下：
| Ctrl | ||
| Ctrl | ||
| Ctrl | ||
| Ctrl | ||
七、实战：我平时怎么用这套工作台
光说功能不够直观，还原三个真实场景：
场景一
全栈开发：Agent 写代码，你直接改
跟 Agent 说"帮我搭一个 Express + React 的全栈脚手架"。生成完在文件管理器里看项目结构，双击文件在编辑器打开，发现路由少了个中间件，直接改，Ctrl+S 存，底部终端跑 npm run dev 看效果。不用跳出 DSH。
场景二
文档编写：Markdown 实时预览
让 Agent 生成一份 API 文档初稿，在 Markdown 预览 Tab 里看渲染效果，发现表格格式不对，切到编辑器 Tab 改源码，保存后预览自动刷新。比"对话、下载、本地改、再传回去"快了不知道多少。
场景三
调试排错：终端、Git、代码一起看
Agent 帮你改了 bug，你在 Git 面板看改了哪些文件，编辑器里 review 代码，终端里跑测试。三个面板同时开着，看完就能提交。
八、短板也说说
不当自来水，好的说了，不足也得讲：
驴哥吐槽
移动端适配这个问题我有切身体会。手机上打开 DSH，侧边栏挤成一团，Tab 切换全靠猜，终端更别提了。当然这不只是 better-sidebar 的问题，DSH 整体在移动端的体验都还差得远。但如果你主力是手机用户，这插件体感打对折。
8.1 安全：沙箱隔离靠谱吗？
内置了浏览器和终端，安全不能不聊。better-sidebar 的安全做法：
- 浏览器 Tab
：运行在不透明源（opaque origin）沙箱 iframe 中，无法访问父页面 DOM、无法读取 Cookie、无法发起跨域请求 - 终端
：基于 node-pty，权限继承 DSH 工作区沙箱，不超出工作区文件系统范围 - 文件操作
：所有文件读写限制在 DSH 工作区内，插件本身不访问系统其他路径 - 第三方注册
：通过 ctx.betterSidebar注册的 Tab 在独立 iframe 中运行，与核心隔离
驴哥心得
安全这块做得比较规矩。不透明源 iframe 是浏览器原生隔离机制，比自己在 JS 里搞沙箱靠谱。终端权限继承 DSH 工作区沙箱也合理，本来就只该动工作区里的文件。代码翻了一遍，没看到明显的安全坑。
九、聊点远的：这插件天花板在哪？
功能和短板都说完了，再往深了聊聊。
我的判断：better-sidebar 的终局不是"功能更多的侧边栏"，而是 DSH 生态的 UI 底座。
道理不复杂。DSH 的核心是 Agent 能力，Agent 能力的入口是交互界面。谁占了交互界面，谁就占了用户和 Agent 之间的通道。better-sidebar 现在做的事，文件管理、编辑器、终端、浏览器，是在修路基。服务化 API 是在修匝道口，让别的插件接进来。
驴哥锐评
打个比方，better-sidebar 之于 DSH，有点像 Spring MVC 之于 Spring。它不是最强的那块，但上层功能都得踩着它建。没它，DSH 生态每个插件都得自己造 UI 轮子；有它，插件开发者只管业务逻辑，UI 注册个 Tab 就行。
所以我的判断是，这插件会变成 DSH 生态的装机必备。跟装完系统先装浏览器一个道理。
当然，到那一步之前还有几个坎：
API 稳定性：接口还在迭代，第三方开发者需要稳定承诺 移动端体验：要覆盖手机用户，双工作台得做响应式重设计 性能基线：注册的 Tab 多了，核心框架启动速度得稳住 生态冷启动：得有第一批吃螃蟹的第三方插件来验证这套 API
十、结论：装不装？
写到这，给个明确说法：
| ★★★★☆ DSH 桌面用户建议装 |
最后一句：better-sidebar 不是锦上添花的插件，它补的是 DSH 从"能用"到"好用"之间缺的那块。你要是 DSH 桌面用户，装了大概率不亏。
DSH 插件深挖（三）：驴哥已经盯上几个有意思的 DSH 插件了，下一期大概率往"多Agent协作"方向走，让 Agent 不只单兵作战，而是能编排多角色的复杂任务流。具体哪个插件？卖个关子，下期见。
AI届搬砖的驴 · DSH 插件深挖系列 · 第二期2026 年 8 月
