# Svelte Markdown vs MDsveX Build-Time Preprocessor vs Runtime Component ## Overview Compare MDsveX and @humanspeak/svelte-markdown: build-time .svx preprocessing versus runtime Svelte 5 markdown rendering, caching, and HTML control. - **Svelte Markdown site:** https://markdown.svelte.page - **Svelte Markdown npm:** https://www.npmjs.com/package/%40humanspeak%2Fsvelte-markdown - **Svelte Markdown slug:** svelte-markdown - **Category:** Preprocessor - **Approach:** Build-time (.svx files) - **Website:** https://mdsvex.pngwn.io - **GitHub:** https://github.com/pngwn/MDsveX - **npm:** https://www.npmjs.com/package/mdsvex ## Feature comparison | Feature | @humanspeak/svelte-markdown | MDsveX | Notes | | --- | --- | --- | --- | | Svelte 5 Compatibility | Yes | Yes | | | TypeScript Support | Yes | Partial | | | Runtime Rendering | Yes | No | MDsveX is build-time only | | Dynamic Content | Yes | No | Cannot render user-supplied markdown | | Custom Renderers | Yes | Yes | | | Token Caching | Yes | No | Not needed — parsed at build time | | LLM Streaming Mode | writeChunk() / resetStream() | No | MDsveX is build-time only, so there is no runtime markdown streaming mode. | | Streaming HTML Output | Partial blocks reconcile when arrives | No | MDsveX compiles at build time — there is no runtime stream that could resolve partial HTML blocks across chunks. | | HTML Tag Control | 83 tags with allow/deny | Via rehype plugins | | | Markdown in Components | Yes | Yes | | | Components in Markdown | No | Yes | | | Frontmatter | No | Yes | MDsveX has built-in frontmatter parsing | | Math (KaTeX) | Built-in extension (markedKatex) | Via remark-math + rehype-katex | | | Diagrams (Mermaid) | Built-in extension (markedMermaid) | Via rehype-mermaid | | | GitHub Alerts | Built-in extension (markedAlert) | Via remark-github-alerts | | | Code Highlighting | Built-in via opt-in Shiki extension | Built-in (Shiki/Prism) | | | Remark/Rehype Plugins | No | Yes | | ## Svelte Markdown strengths - 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 - Renders dynamic/user-supplied markdown at runtime - No build step required — works with any markdown string - Math, Mermaid, alerts, and footnotes ship as first-class extensions — no remark/rehype pipeline required - Simpler mental model — just pass a string, get rendered output ## MDsveX strengths - Established Svelte markdown ecosystem (~3,000 GitHub stars) - Build-time optimization — zero runtime parsing cost - Use Svelte components directly inside markdown files - Rich plugin ecosystem via unified/remark/rehype - Built-in code syntax highlighting - Frontmatter parsing out of the box ## Svelte Markdown limitations - Smaller community (newer project) - Runtime-only (no build-time optimization) - Cannot embed Svelte components inside markdown content - No frontmatter support (parse separately if needed) ## MDsveX limitations - Cannot render dynamic/user-supplied markdown - Content must exist at build time as .svx files - Adds build complexity (preprocessor configuration) - Not suitable for CMS content, user input, or API-fetched markdown ## Verdict Choose MDsveX for static content sites, blogs, and documentation where markdown is known at build time. Choose @humanspeak/svelte-markdown when you need to render dynamic markdown — CMS content, user input, API responses, or any scenario where the markdown string is not known until runtime. ## Keywords mdsvex, svelte markdown, mdsvex vs svelte-markdown, svelte markdown preprocessor, svelte markdown component