Code Diff Viewer: See Exactly What Changed
Eyeballing two similar blocks of code to spot the difference is slow and error-prone. This tool runs a real diff algorithm against your two inputs and highlights additions in green and removals in red — switchable between line-level (best for code structure) and word-level (best for spotting a single changed token) granularity.
Line mode compares whole lines as units; word mode compares individual words/tokens.
Why 'Shortest Edit Script' Matters
A naive diff might show your entire file as deleted and entirely re-added if it compared character-by-character without care — a proper diff algorithm finds the minimal set of insertions and deletions needed to transform one text into the other, which is why unrelated unchanged lines stay untouched even when nearby lines change significantly.
Choosing Line vs. Word Diff
Line diff is the right default for comparing code — you usually care about which whole lines were added, removed, or modified. Word diff is better suited for prose, config values, or spotting a subtle one-token change (like a typo fix or a version bump) buried inside an otherwise-identical line.
Practical Examples
Reviewing a Function Signature Change
Comparing before/after of a refactored function.
- 1.Paste original in left box
- 2.Paste modified in right box
- 3.Line diff highlights the changed signature and body line
Good Use Cases
- Reviewing a code change outside of a full git diff view
- Comparing two versions of a config file or JSON blob
- Spotting subtle text differences between two API responses
- Checking what changed after running a formatter or codemod
Frequently Asked Questions
What diffing algorithm does this use?
The battle-tested `diff` npm library (the same Myers diff algorithm family used by many git tooling and text-comparison libraries), computing the shortest edit sequence between the two inputs rather than a naive character-by-character comparison.
What's the difference between line diff and word diff?
Line diff treats each full line as a unit — useful for spotting which lines were added, removed, or reordered in code. Word diff breaks the comparison down to individual words, which is better for prose or for spotting a single changed token within an otherwise identical line.
Why does a changed line sometimes show as both removed and added?
A one-word change inside a long line often gets represented as the old line fully removed and the new line fully added, since diffing algorithms compare whole lines as units in line mode — switch to word diff to see just the specific word that changed.
Can I diff two full files, not just snippets?
Yes — paste any amount of text into either box; there's no artificial length limit beyond what your browser can comfortably render.
Is my code sent anywhere?
No, diffing happens entirely in your browser — no upload.