markstream-vue: a flicker-free streaming Markdown renderer for AI chat and LLM token streams

What it solves

Typical Markdown renderers are designed for finished documents, which causes flickering and performance issues when rendering text that is still being generated (such as AI chat responses via SSE or WebSockets). Markstream provides a stable, flicker-free way to render incomplete Markdown states in real-time.

How it works

Markstream uses a specialized rendering engine designed for streaming content. It offers two primary modes: a virtual window for long documents and incremental batching for "typing" effects. It can handle raw Markdown strings or pre-parsed nodes and supports progressive rendering for heavy elements like Mermaid diagrams and code blocks (via Monaco/Shiki).

Who it’s for

Developers building AI chat interfaces, LLM-powered applications, or any UI that requires streaming text output using Vue 3, Nuxt, React, Svelte 5, or Angular.

Highlights

• Streaming-First Design: Specifically built to minimize flicker and maintain predictable memory usage during AI token streams.
• Multi-Framework Support: Dedicated packages for Vue, React, Svelte, and Angular.
• Progressive Rendering: Supports streaming code blocks and diagrams (Mermaid) that update as the content grows.
• Rich Integrations: Optional support for KaTeX (math), Monaco (code editor), and Shiki (syntax highlighting).
• Flexible Modes: Includes a chat mode for steady pacing and a docs mode for richer layouts.