# LLM Streaming > Simulate model streaming with @humanspeak/svelte-markdown: offset patches, speed and jitter controls, live metrics, and converging markdown output. **Source:** [https://markdown.svelte.page/examples/llm-streaming](https://markdown.svelte.page/examples/llm-streaming) **Markdown mirror:** [https://markdown.svelte.page/examples/llm-streaming.md](https://markdown.svelte.page/examples/llm-streaming.md) --- This mirror preserves the prose, implementation notes, and runnable Svelte source behind the live example page. ## FIG-001: llm streaming. Stream markdown the way real models actually deliver it — `{ value, offset }` patches that can arrive out of order. Toggle speed, jitter, and granularity to stress-test ChatGPT / Claude / Gemini delivery patterns. **Metadata:** tag: `STREAMING` | mode: `offset · jumbled` ### Notes - LLMs stream tokens via SSE. SvelteMarkdown re-parses and re-renders on each update, keeping output in sync — even when patches arrive out of order. - Render times stay under one frame budget (16ms) for typical LLM speeds of 30–80 tokens/sec. - Track token costs across providers with [ModelPricing.ai](https://modelpricing.ai). - Building a chat UI? Pair with [@humanspeak/svelte-virtual-chat](https://virtualchat.svelte.page) for a virtualized chat viewport purpose-built for LLM conversations. ### Source #### StreamingConsole.svelte Source file: [src/lib/examples/llm-streaming/demos/StreamingConsole.svelte](https://github.com/humanspeak/svelte-markdown/blob/main/docs/src/lib/examples/llm-streaming/demos/StreamingConsole.svelte) ```svelte

file · llm-streaming.svelte avg {formatMs(avgRenderTime)} peak {formatMs(peakRenderTime)} chunks {tokenCount}/{chunks.length || '—'} {#if isStreaming}● LIVE{:else}○ IDLE{/if}

SRC / STREAMING {input.length} chars

{#if isStreaming || tokenCount > 0}

{displaySource}

{:else} {/if}

OUT / RENDERED {#if isStreaming} streaming {:else if tokenCount > 0 && tokenCount >= chunks.length} complete {:else} idle {/if}

{#if renderSource || chunkedStreamActive}

{:else}

Click "Start" to begin streaming.

{/if}

speed {tokensPerSecond}/s jitter {jitterPercent}%

chunk

{#each ['character', 'word', 'sentence'] as m (m)} {m} {/each}

mode

offset (default) writeChunk source +=

{#if streamMode === 'offset'} shuffle so later patches arrive first {/if}

```