examples.
Hands-on demos of @humanspeak/svelte-diff. Change inputs, compare cleanup strategies, inspect expected captures and timings, then open the exact Svelte source.
pick a diff.
Every page is a self-contained example with live output and the implementation source.
basic diff.
START
The smallest useful setup: two strings, semantic cleanup, and class-based styling.
live editor.
REACTIVE
Edit both strings and watch Svelte recompute a readable diff immediately.
expected patterns.
PATTERNS
Match versions, dates, and names as intentional variation and inspect captures.
custom snippets.
RENDERING
Replace default spans with semantic del/ins markup and your own visual language.
cleanup modes.
READABILITY
Compare raw, efficiency-cleaned, and semantically-cleaned output side by side.
timing.
PERFORMANCE
Scale the input and watch core, cleanup, total, and segment metrics update.
the live diff → before / after / output