vssvelte streamdown.

Two Svelte 5 Renderers Built for AI Streaming

get started ↗ examples all comparisons

FIG-001

SHEET 01 / 07

FIG-002 / OVERVIEW

at a glance.

Compare svelte-streamdown and @humanspeak/svelte-markdown: two Svelte 5 markdown renderers for streaming AI output, with different approaches to styling, caching, HTML, MDX, and rich content.

FIG-003 / FEATURE MATRIX

side-by-side.

Every surface that matters, compared without spin.

feature	@humanspeak/svelte-markdown	Svelte Streamdown
Svelte 5 Compatibility	yes	yes
TypeScript Support	yes	yes
Streaming API Svelte Markdown can consume transport deltas directly. With Svelte Streamdown, the application maintains and repeatedly supplies the accumulated content string.	Reactive source or direct writeChunk() ingestion	Reactive complete-content prop
Out-of-Order Chunk Delivery Svelte Markdown accepts writeChunk({ value, offset }) and assembles websocket-style chunks even when they arrive out of order. Svelte Streamdown accepts a complete content string, so callers must order and assemble chunks before updating the prop.	Native offset-addressed chunk assembly	no
Mid-Stream Corrections Offset-addressed writes support retransmission, transcription correction, and edits to previously received output without requiring callers to reconstruct the complete document first.	Offset writes can replace earlier ranges	Caller rebuilds the content string
Stream Lifecycle Isolation Svelte Markdown provides synchronous resetStream() and declarative streamId boundaries to prevent content from one response carrying into the next.	resetStream() + streamId	Caller-managed content state
Incomplete Markdown Both projects are designed to keep partial AI output renderable while new content arrives.	yes	yes
Streaming HTML Output Svelte Markdown explicitly tracks incomplete raw HTML tails; Svelte Streamdown documents graceful handling for incomplete markdown and MDX blocks.	Partial blocks reconcile when </tag> arrives	Incomplete blocks handled
Repeated Document Cache Svelte Streamdown caches block splitting and uses Svelte reactivity to reuse unchanged mounted blocks, but does not provide a reusable LRU for completed documents that are revisited or remounted.	Built-in configurable LRU + TTL	no
Append-Only Stream Reuse Both avoid needlessly parsing stable content. Svelte Markdown additionally coalesces bursts of incoming updates at the animation-frame boundary.	Tail-window parser + frame coalescing	Cached block splitting + reactive block reuse
Measured Streaming Performance Production Chromium benchmark against svelte-streamdown 3.1.2. Across 10–200 KB append-only streams, Svelte Markdown completed burst workloads in roughly half to one quarter of the time by coalescing updates per animation frame. At one 512-character update per frame over 50 KB, both sustained about 59 updates/second. The 50 KB output used 2,821 descendant elements with Svelte Markdown versus 3,480 with Svelte Streamdown. Reproduce with pnpm perf:stream-compare.	2–4× faster under burst backpressure	Effectively tied when updates are frame-paced
Measured DOM Footprint (50 KB) Measured by the production Chromium streaming benchmark with animations and optional rich-content controls disabled. The difference reflects each renderer’s output structure; Svelte Streamdown’s additional presentation features may justify that structure for applications that use them.	2,821 descendant elements	3,480 descendant elements
Custom Renderers	24 markdown + 83 HTML snippet overrides	Typed snippets + theme system
HTML Tag Control	83 tags with allow/deny helpers	skipHtml + allowed element controls
URL Safety Defaults Svelte Streamdown exposes link and image prefix controls; their documented default is ["*"].	Protocol allowlist + attribute sanitization	Configurable prefixes (allow all by default)
Streaming Animations	no	Word, character, or block animations
MDX-Style Components	no	yes
Inline Citations	no	Popover + list/carousel views
Built-in Styling	Unstyled by default	Tailwind typography + themes
Math (KaTeX)	Opt-in first-class extension	Opt-in component
Diagrams (Mermaid)	Opt-in first-class extension	Opt-in interactive component
Code Highlighting	Opt-in Shiki extension	Opt-in Shiki component + copy button
Marked Extensions	Full extension objects	Custom tokenizers
Advanced Tables	GFM tables	GFM + row/column spans, footers, multiple headers

FIG-004 / STRENGTHS

where each shines.

▣ svelte markdown 20

+Svelte 5 runes-native — built for runes, not retrofitted
+TypeScript-first with full type safety
+Built-in token caching (50-200x faster re-renders on repeated content)
+LLM streaming with imperative writeChunk() / resetStream() API
+24 markdown renderers + 83 HTML tag renderers — every override is a Svelte snippet
+First-class extensions: KaTeX math, Mermaid diagrams, GitHub alerts, footnotes
+Opt-in Shiki syntax highlighting (streaming-compatible, tree-shaken from core)
+Built-in XSS protection — protocol allowlist, event-handler stripping, attribute sanitization
+Allow/deny utilities (allowHtmlOnly, excludeRenderersOnly, etc.) for fine-grained control
+Drop-in component — works anywhere in your Svelte app
+Direct transport-delta ingestion without maintaining a second reactive accumulator
+Native out-of-order chunk assembly with offset-addressed writes
+Mid-stream replacement writes for corrections and retransmission
+Explicit resetStream() and streamId lifecycle boundaries
+Measured 2–4× faster than svelte-streamdown 3.1.2 under burst backpressure
+Measured about 19% fewer descendant elements on the 50 KB benchmark
+Configurable LRU cache also accelerates repeated non-streaming documents
+Broad raw HTML support with per-tag renderers and allow/deny helpers
+Stricter URL and attribute sanitization enabled by default
+Unstyled core integrates without requiring Tailwind

▢ svelte streamdown 5

+Purpose-built streaming animations at word, character, and block level
+MDX-style custom Svelte components inside runtime markdown
+Interactive citations with popover, list, and carousel presentations
+Opinionated typography and granular Tailwind theme system out of the box
+Rich built-ins including interactive Mermaid controls, code copy buttons, and advanced tables

FIG-005 / LIMITATIONS

where each falls short.

▣ svelte markdown 5

−Smaller community (newer project)
−Runtime-only (no build-time optimization)
−No built-in token reveal animations or citation UI
−No MDX-style component syntax inside markdown
−Requires application styling by design

▢ svelte streamdown 7

−No imperative chunk-ingestion API — callers update the complete content string
−No native offset-addressed assembly for out-of-order chunks or earlier-range corrections
−Stream resets and response isolation are managed in caller-owned content state
−No reusable LRU cache for switching among previously rendered documents
−Link and image prefix controls allow all origins by default
−Opinionated styling requires Tailwind setup or theme overrides
−A newer, single-maintainer port that tracks the upstream React project

FIG-006 / VERDICT

the honest call.

Choose Svelte Streamdown when you want a batteries-included AI response UI with animated reveals, citations, MDX-style components, interactive diagrams, and Tailwind styling. Choose @humanspeak/svelte-markdown when you want a lower-level, unstyled renderer with direct and out-of-order chunk ingestion, explicit stream lifecycle controls, frame-coalesced updates, reusable document caching, broad raw-HTML customization, and stricter security defaults. Both are credible Svelte 5 choices for incomplete streaming markdown; the deciding factor is whether you want an opinionated presentation layer or a composable rendering primitive.

FIG-007 / MORE