Preface

The core design philosophy of DeepSeek Harness (DSH) is “everything is a plugin.” When building AI chat interfaces, the streaming rendering experience is critical. The default Markdown renderer often suffers from jitter and has limited support for complex content such as code highlighting and diagrams.

dsh-markstream is a DSH Web plugin. It replaces the default assistant-step renderer with markstream-react, providing low-jitter incremental streaming render capabilities, and supports code block diff comparison, Mermaid diagrams, KaTeX formula rendering, and safe HTML.

Plugin Overview

  • Functional Positioning: A DSH Web plugin used to render assistant message streams.
  • Maintainer: boomboomxx.
  • License: MIT.
  • Technology Stack: Based on markstream-react, integrated with the DSH client runtime.

Core Features

  1. Renderer Replacement
    The plugin registers in the keyed slot of conversation.chat.node with a priority of -10, overriding the built-in system renderer that has a default priority of 0. This ensures that the custom rendering logic takes precedence in the UI.

  2. Streaming Rendering Features

    • Text Blocks: Rendered via <MarkdownRender content final fade>, including low-jitter incremental streaming output and intermediate states of incomplete Markdown.
    • Code Blocks: Supports streaming diff display (requires the stream-diffs package).
    • Diagrams and Formulas: Supports Mermaid diagram rendering (requires the mermaid package) and KaTeX formula rendering (tree-inlined dependency).
    • Safe HTML: Provides safe HTML rendering support.

  3. UI Preservation
    The renderer preserves the original specific UI structure of the system:

    • Reasoning blocks retain the “thinking” expandable line.
    • Image groups retain the attachment gallery.
    • Unknown blocks retain the JSON fallback.
    • Interruption messages retain the “stopped” marker.
    • The bottom node (turn-tail, including icon actions / file generation lines) and tool row rendering remain unchanged.

Configuration

The plugin can no longer be accessed through the “Settings -> Plugins -> Configuration” card. The only configuration entry point is the floating gear button in the bottom-right corner of the interface.

  1. Entry Point and Panel
    Click the floating gear in the bottom-right corner (the shell.overlay entry dsh-markstream-config) to open a non-modal floating panel. The panel height is approximately 70% of the conversation window, vertically centered, and does not block other page operations.

  2. Configuration Items
    Configuration items are overwritten and persisted to $DSH_HOME/settings.yaml. After modification, they take effect immediately through the revision-fenced settings domain, and the renderer is automatically reinstalled.

Basic Settings

Field Default Description
enabled true Toggle: set to false to restore the system default renderer.
theme auto Theme: auto (follows DSH theme), light, dark.
fade true Text fade-in animation.
typewriter false Cursor blinking effect during streaming content.

Code Block Settings

Field Default Description
codeBlockShowHeader true Show the code block header.
codeBlockShowTooltips true Show tooltips.
codeBlockShowFontSizeButtons true Show font size buttons.
codeBlockShowCollapseButton false Show the collapse button.
codeBlockDiffStyle unified Diff display style: unified or split.
codeBlockOverflow wrap Overflow handling: wrap or scroll.
codeBlockExpandUnchanged false Collapse unchanged diff regions.
codeBlockEnableLineSelection true Enable line selection.
codeBlockDisableLineNumbers false Hide line numbers.
codeBlockFontSize 13 Font size (px).
codeBlockTabSize 2 Tab indentation width.
codeBlockPadding 12 Code block padding (px).
codeBlockMaxHeight 480 Maximum height (px); 0 means unlimited.
codeBlockLightTheme vitesse-light Light code theme.
codeBlockDarkTheme vitesse-dark Dark code theme.

Diagram Settings

Field Default Description
mermaidEnabled false Enable Mermaid rendering (requires installing the mermaid package).
mermaidIsStrict true Strict mode.
mermaidMaxHeight 480 Maximum height (px).
d2Enabled false Enable D2 rendering (requires installing the @terrastruct/d2 package).
d2MaxHeight 480 Maximum height (px).

Notes

  1. Dependency Requirements: Advanced features (such as streaming code diffs, Mermaid, and D2) require installing the corresponding optional dependency packages. Otherwise, they will fall back to basic rendering modes (such as plain <pre> tags or source code display).
  2. Configuration Entry Change: Because dsh-markstream models a floating configuration panel, the Markstream card is no longer displayed in the DSH interface list under “Settings -> Plugins -> Configuration”.
  3. Dictionary Reuse: The renderer reuses dictionaries in the ui-conversation namespace (such as row.running, message.stopped, etc.), so no additional language pack registration is required.

Conclusion

dsh-markstream uses markstream-react to address the streaming rendering jitter and limited feature set in the DSH chat interface. It provides fine-grained control through a floating panel in the bottom-right corner, supports code diffs, diagram rendering, and custom themes, making it suitable for developers who need high-quality chat UI displays.

  • GitHub: https://github.com/boomboomxx/dsh-markstream
  • Catalog Page: https://www.skillhub.cn/plugins/boomboomxx/dsh-markstream