Overview
marked is the markdown parser that powers @humanspeak/svelte-markdown. Using marked directly gives you a raw HTML string; we wrap it in a full Svelte component system with renderers, caching, and safety controls.
Type: Markdown Parser
Approach: String in, HTML string out
Feature Comparison
| Feature | @humanspeak/svelte-markdown | marked |
|---|---|---|
| Svelte 5 Native | ||
| TypeScript Support | ||
| Component Output | Svelte components | Raw HTML string |
| Custom Renderers | Svelte components | Token manipulation |
| Token Caching | Built-in LRU cache | Manual implementation |
| HTML Safety | Allow/deny per tag | Manual sanitization |
| Extensions | Full marked extensions support | Full extensions API |
| GFM Support | ||
| Bundle Size | ~15KB (includes marked) | ~8KB (parser only) |
| Framework Integration | Native Svelte | Requires {@html} |
Svelte Markdown Strengths
- Svelte 5 runes-native — no legacy compatibility layers
- TypeScript-first with full type safety
- Built-in token caching (50-200x faster re-renders)
- 24 markdown renderers + 69+ HTML tag renderers
- Allow/deny utilities for fine-grained control
- Drop-in component — works anywhere in your Svelte app
- All the power of marked, wrapped in Svelte components
- Full marked extensions API pass-through
- No {@html} needed — renders as safe Svelte components
marked Strengths
- Most popular JS markdown parser (21M+ weekly npm downloads)
- Smaller bundle (parser only, no rendering layer)
- Framework-agnostic — use anywhere
- Maximum flexibility with token/renderer hooks
- Extensive extension ecosystem
Svelte Markdown Limitations
- Smaller community (newer project)
- Runtime-only (no build-time optimization)
- Slightly larger bundle (includes rendering layer on top of marked)
marked Limitations
- Outputs raw HTML — requires {@html} and manual XSS handling
- No component-based rendering in Svelte
- Must manually implement caching
- No allow/deny controls for HTML tags
The Verdict
We use marked internally — so you get all of its parsing power for free. Choose marked directly when you need a framework-agnostic parser or want the absolute smallest bundle. Choose @humanspeak/svelte-markdown when you want the Svelte DX layer: component rendering, caching, HTML controls, and TypeScript types.
Try @humanspeak/svelte-markdown
Install in seconds and render your first markdown.