前言¶

DeepSeek Harness (DSH) 的核心設計理念是“一切皆插件”。在構建 AI 聊天界面時，流式渲染（Streaming）的體驗至關重要。默認的 Markdown 渲染器通常存在抖動（Jitter）問題，且對代碼高亮、圖表等複雜內容的支持有限。

dsh-markstream 是一款 DSH Web 插件，它通過 markstream-react 替換了默認的 assistant-step 渲染器，提供了低抖動的增量流式渲染能力，支持代碼塊差異對比、Mermaid 圖表、KaTeX 公式渲染以及安全 HTML。

插件概覽¶

渲染器替換
插件在 conversation.chat.node 的 keyed slot 中註冊，優先級設爲 -10，從而覆蓋默認優先級爲 0 的系統內置渲染器。這確保了自定義渲染邏輯在 UI 中優先執行。
流式渲染特性
- 文本塊：通過 <MarkdownRender content final fade> 渲染，包含低抖動增量流式輸出及不完整 Markdown 的中間狀態。
- 代碼塊：支持流式差異顯示（需 stream-diffs 包）。
- 圖表與公式：支持 Mermaid 圖表渲染（需 mermaid 包）和 KaTeX 公式渲染（依賴樹內聯）。
- 安全 HTML：提供安全的 HTML 渲染支持。
UI 保留
渲染器保留了系統原有的特定 UI 結構：
- 推理塊保留“思考”展開行。
- 圖片組保留附件畫廊。
- 未知塊保留 JSON 回退。
- 中斷消息保留“已停止”標記。
- 底部節點（turn-tail，包含圖標操作/文件生成行）和工具行渲染保持不變。

該插件不再通過“設置 -> 插件 -> 配置”卡片進入，唯一的配置入口是界面右下角的浮動齒輪按鈕。

入口與面板
點擊右下角的浮動齒輪（shell.overlay 條目 dsh-markstream-config）打開非模態浮動面板。面板高度約爲對話窗口的 70%，垂直居中，不阻塞頁面其他操作。
配置項
配置項會覆蓋並持久化到 $DSH_HOME/settings.yaml。修改後通過 revision-fenced 設置域立即生效，渲染器會自動重新安裝。

基礎設置

代碼塊設置

字段	默認值	說明
`codeBlockShowHeader`	`true`	顯示代碼塊頭部。
`codeBlockShowTooltips`	`true`	顯示提示信息。
`codeBlockShowFontSizeButtons`	`true`	顯示字體大小按鈕。
`codeBlockShowCollapseButton`	`false`	顯示摺疊按鈕。
`codeBlockDiffStyle`	`unified`	差異顯示風格：`unified` 或 `split`。
`codeBlockOverflow`	`wrap`	溢出處理：`wrap` 或 `scroll`。
`codeBlockExpandUnchanged`	`false`	摺疊未變化的差異區域。
`codeBlockEnableLineSelection`	`true`	啓用行選擇。
`codeBlockDisableLineNumbers`	`false`	隱藏行號。
`codeBlockFontSize`	`13`	字體大小 (px)。
`codeBlockTabSize`	`2`	Tab 縮進寬度。
`codeBlockPadding`	`12`	代碼塊內邊距 (px)。
`codeBlockMaxHeight`	`480`	最大高度 (px)，`0` 爲無限制。
`codeBlockLightTheme`	`vitesse-light`	亮色代碼主題。
`codeBlockDarkTheme`	`vitesse-dark`	暗色代碼主題。

圖表設置

依賴要求：高級功能（如流式代碼差異、Mermaid、D2）需要安裝對應的可選依賴包，否則將回退到基礎渲染模式（如純 <pre> 標籤或源碼顯示）。
配置入口變更：由於 dsh-markstream 模型化了一個浮動的配置面板，DSH 界面中的“設置 -> 插件 -> 配置”列表中不再顯示 Markstream 卡片。
複用字典：渲染器複用了 ui-conversation 命名空間中的字典（如 row.running、message.stopped 等），無需額外註冊語言包。

dsh-markstream 通過 markstream-react 解決了 DSH 聊天界面中流式渲染抖動和功能單一的問題。它通過右下角的浮動面板提供了精細的控制，支持代碼差異、圖表渲染和自定義主題，適合需要高質量聊天 UI 展示的開發者。