Big Diffr

Compare consecutive revisions with smart inline diffing - ignores whitespace and blank lines

Michael E. Kupietz - demos🐬michaelkupietz.com - https://michaelkupietz.com/demos/big-diffr/

Big Diffr

- quickly see the differences between many consecutive revisions of your text or code.

The idea is, if you have an automated process, such as an LLM, working on your code, every time it spits out a new version, you can never be completely sure what changes it has actually made, unless you check the entire output line-by-line. This makes that easy

In fact, this tool was developed because I learned that the hard way: I used Anthropic's Claude to help add new features to existing code of mine, but I didn't discover until much later on that it had also silently changed or removed other important parts of my code, which weren't at all related to what I was using it to work on.

Quick Start, for people who just want to quickly demo this:

1. Just hit the red ❌ at upper right to close this box

2. click

3. Click the various lines where it says ▶︎ View Differences to see the differences between various successive versions of the sample data.

Detailed Instructions:

(click to open)

Add your original code in the blank marked Original Text , and the first revision in the blank marked Version 1. When both have been entered, you will see a ▶︎ View Differences line below them... you can click on this to open the diff and see all the differences between them.

Also, your Version 1 will automatically be added as the starting revision on a new line below, ready for you to paste in Version 2 and see the further changes as you create more revisions.

This way, every time an LLM generates a new revision to your code, you can paste it in and easily see everything it changed—whether it made only the revisions it said it would, or also made other changes you didn't ask for.

Customizing the settings:

On occasion, the diff algorithm will indicate minor changes showing an entire line removed and another entire line inserted, as follows:

- Here is one line, mostly the same as the other one.

+ Here is another line, mostly the same as the other one.

I gave the algorithm the ability to decide, if two lines are similar enough, to compress the changes into a single line, as follows:

± Here is oneanother line, mostly the same as the other one.

Because there is no "one size fits all" way of doing this, you can see and tweak the parameters the algorithm uses to decide whether changes should be shown by removing and adding complete lines in their entirety, or inline in a single line, by hitting the button at top.

Saving and Reloading Sessions:

In case you need to interrupt your work, you can save or reloads the entire state of the app, including all currently entered revisions, with the and buttons.

Inline Diff Settings

These settings control when changed lines are merged and displayed as a single line with all changes indicated inline vs. shown separately as entire lines - deleted or + inserted. Hover your mouse on the icons on the right side of a diff line to see why it merged or not.

Content Similarity

How similar in length two lines must be to consider merging them. Lower values are more permissive. Set to 0% to ignore length differences entirely.
10%
Minimum percentage of words that must be shared between lines. Lower values are more permissive. Set to 0% to merge lines even with no common words.
5%
How different two lines can be character-wise and still merge. Higher values allow merging lines that look very different but have similar meaning (like "obj.method()" vs "object.method()").
95%

Structure Matching (beta)

Lines must start similarly OR end similarly to be merged. Good for catching function calls with different parameters. Leave unchecked to be more permissive.
How many characters from the start of lines to compare for structural similarity.
chars
How many characters from the end of lines to compare for structural similarity.
chars

Advanced Options (beta)

Compare the overall structure of lines (ignoring specific words/numbers). Helps catch similar code patterns. More CPU intensive.
When pattern matching is enabled, minimum word similarity required if patterns don't match exactly.
80%
Maximum number of insert/delete changes allowed to be merged and shown inline in a single line. Lines with more than this number of internal changes will always show as separate added/removed lines instead. Higher values allow more complex inline diffs (ie, harder to read).
groups
Show Strike-Through on deleted text Show Wavy Underline on inserted text
Fork me on GitHub