Diff viewer

Side-by-side text diff with line-level highlighting powered by LCS algorithm

Original

Modified

Diff

+2 added-3 removed
1-function greet(name) {
2- console.log('Hello, ' + name);
3- return true;
1+function greet(name, greeting = 'Hello') {
2+ console.log(greeting + ', ' + name + '!');
43 }

TL;DR

What is Diff viewer?

A side-by-side diff viewer displays two versions of a text file in parallel columns, with added lines highlighted in green and removed lines in red. This layout makes it easier to understand what changed compared to a unified diff, where additions and deletions are interleaved in a single column.

Common use cases

  • Code review: compare two versions of a file to understand a change before merging
  • Config comparison: review differences between a current and proposed configuration file side by side
  • Document revision: compare two versions of a specification or contract to find changed clauses
  • Migration validation: diff the output of a data transformation against the expected result

Frequently asked questions

What is the difference between a unified diff and a side-by-side diff?

A unified diff (the default output of git diff and the Unix diff command) shows both files in a single column: lines starting with + are additions and lines starting with - are deletions, interspersed with unchanged context lines. A side-by-side diff shows the files in two columns, making it easier to read large changes but requiring more horizontal space.

What is the LCS algorithm?

LCS (Longest Common Subsequence) finds the longest sequence of lines that appear in both inputs in the same order. Lines not in the LCS are marked as added or removed. It is the algorithm underlying Unix diff, Git diff, and most diff viewers.