# Live Editor
> Edit before and after text and watch SvelteDiff recompute semantic output reactively.
**Source:** [https://diff.svelte.page/examples/live-editor](https://diff.svelte.page/examples/live-editor)
**Markdown mirror:** [https://diff.svelte.page/examples/live-editor.md](https://diff.svelte.page/examples/live-editor.md)
---
This mirror preserves the prose, implementation notes, and runnable Svelte source behind the live example page.
## FIG-001: live editor.
Two rune-backed textareas feed `SvelteDiff` directly. Edit either document and normal Svelte reactivity produces the next comparison without an imperative recompute call.
**Metadata:** tag: `REACTIVE` | inputs: `reactive` | cleanup: `semantic`
### Source
#### LiveEditor.svelte
Source file: [src/lib/examples/live-editor/demos/LiveEditor.svelte](https://github.com/humanspeak/svelte-diff/blob/main/docs/src/lib/examples/live-editor/demos/LiveEditor.svelte)
```svelte