String Diff Utilities
Line-based and character-level text diffing utilities for comparing strings and highlighting differences.
Overview
These functions provide both line-level diffs (similar to git diff) and character-level highlighting for granular change visualization using the Longest Common Subsequence (LCS) algorithm.
computeTextDiff
Computes a line-based text diff between two strings.
Function Signature
function computeTextDiff(originalText: string, modifiedText: string): DiffResultParameters
originalText(string): The original (before) text.modifiedText(string): The modified (after) text.
Return Value
DiffResult: An object containing the array of line differences and summary statistics.
Example Usage
playground.ts
Notes
- Lines are classified as
added,removed,modified, orunchanged. - Detects and pairs similar
removedandaddedlines asmodifiedwhen similarity is>= 60%. Similarity is calculated using Levenshtein distance.
getCharacterDifferences
Highlights character-level differences between two strings.
Function Signature
function getCharacterDifferences(original: string, modified: string): CharDiffResultParameters
original(string): The original string to compare from.modified(string): The modified string to compare to.
Return Value
CharDiffResult: An object containing annotated character arrays for both strings.
Example Usage
playground.ts
Types
DiffResult
/** Statistics summarizing the diff results, including counts of added, removed, changed, and unchanged lines. */
interface DiffStats {
/** Total number of lines that were added in the modified string compared to the original. */
linesAdded: number;
/** Total number of lines that were removed from the original string in the modified version. */
linesRemoved: number;
/** Total number of lines that were modified (changed content) between the original and modified strings. */
linesChanged: number;
/** Total number of lines that remained unchanged between the original and modified strings. */
linesUnchanged: number;
}
/** The result of a line-level diff operation, including an array of line differences and summary statistics. */
interface DiffResult {
/** An array of line differences, where each line is categorized as 'added', 'removed', 'unchanged', or 'modified'. */
lines: DiffLine[];
/** Statistics summarizing the diff results, including counts of added, removed, changed, and unchanged lines. */
stats: DiffStats;
}DiffLine
/** Represents a single line's diff status between two strings, including the type of difference and the content of the line in both original and modified strings. */
type DiffLine = UnchangedOrModifiedDiffLine | AddedDiffLine | RemovedDiffLine;
/** Represents the details of a single line in the diff, including its content and line number. */
interface DiffLineDetails {
/** The content of the original line, omitted for `added` lines. */
original: string;
/** The content of the modified line, omitted for `removed` lines. */
modified: string;
/** The line number in the original string (1-based), omitted for `added` lines. */
originalLineNum: number;
/** The line number in the modified string (1-based), omitted for `removed` lines. */
modifiedLineNum: number;
}
/** Represents an unchanged or modified line, including both original and modified content and their respective line numbers. */
interface UnchangedOrModifiedDiffLine extends DiffLineDetails {
/** The type of difference, either `'unchanged'` or `'modified'`. */
type: 'unchanged' | 'modified';
}
/** Represents an added line, including only its content and line number in the modified string. */
interface AddedDiffLine extends Omit<DiffLineDetails, 'originalLineNum' | 'original'> {
/** The type of difference, fixed to `'added'`. */
type: 'added';
}
/** Represents a removed line, including only its content and line number in the original string. */
interface RemovedDiffLine extends Omit<DiffLineDetails, 'modifiedLineNum' | 'modified'> {
/** The type of difference, fixed to `'removed'`. */
type: 'removed';
}CharDiffResult
/** A single character annotated with a `highlighted` flag indicating whether it differs from the other string in a diff operation. */
interface HighlightedText {
/** The text content of the character. */
text: string;
/** Whether the character is different from the other string in a diff operation. */
highlighted: boolean;
}
/** Result of a character-level diff, mapping each character in both strings to a `highlighted` flag. */
interface CharDiffResult {
/** An array of characters from the original string, each annotated with a `highlighted` flag indicating whether it differs from the modified string. */
original: HighlightedText[];
/** An array of characters from the modified string, each annotated with a `highlighted` flag indicating whether it differs from the original string. */
modified: HighlightedText[];
}Last updated: Wed, Jun 17, 2026 03:15:49AM (UTC)
