Text Diff

Bandingkan dua teks berdampingan dan sorot perbedaan baris per baris

Coba contoh

Teks A

Teks B

Berjalan lokal ยท Aman untuk menempel rahasia
Berjalan lokal ยท Aman untuk menempel rahasia

Apa Itu Text Diff?

Text diff (singkatan dari "difference" atau perbedaan) adalah hasil perbandingan dua blok teks yang mengidentifikasi baris mana yang ditambahkan, dihapus, atau tidak berubah. Konsep ini berasal dari utilitas diff Unix, yang pertama kali dirilis pada tahun 1974 sebagai bagian dari Version 5 Unix. Saat ini, text diff menjadi tulang punggung sistem kontrol versi seperti Git, di mana setiap commit menyimpan diff alih-alih salinan lengkap setiap file.

Algoritma diff mencari Longest Common Subsequence (LCS) antara dua urutan baris. Baris yang ada di LCS ditandai sebagai tidak berubah. Baris yang ada di teks asli tetapi tidak di LCS ditandai sebagai dihapus. Baris yang ada di teks yang dimodifikasi tetapi tidak di LCS ditandai sebagai ditambahkan. Hasilnya adalah sekumpulan perubahan minimal yang diperlukan untuk mengubah satu teks menjadi teks lainnya.

Keluaran diff hadir dalam beberapa format. Unified diff (format default untuk git diff) memberi awalan tanda minus pada baris yang dihapus dan tanda plus pada baris yang ditambahkan. Diff berdampingan menampilkan kedua teks dalam kolom paralel. Alat ini menggunakan perbandingan baris per baris dengan keluaran berkode warna: hijau untuk penambahan, merah untuk penghapusan, dan netral untuk baris yang tidak berubah. Baris yang tidak berubah ditampilkan tanpa awalan secara default, tetapi dapat disembunyikan agar hanya fokus pada perubahan.

Mengapa Menggunakan Alat Text Diff Online?

Membandingkan teks di terminal memerlukan instalasi utilitas diff dan pemahaman flag baris perintah. Alat diff berbasis browser menghilangkan hambatan tersebut sepenuhnya.

โšก
Perbandingan instan
Tempel dua blok teks dan lihat perbedaan yang disorot secara langsung. Tidak perlu membuat file, tidak ada perintah untuk diingat, tidak ada keluaran untuk diuraikan.
๐Ÿ”’
Pemrosesan mengutamakan privasi
Semua perbandingan terjadi di browser Anda menggunakan JavaScript. Teks Anda tidak pernah meninggalkan perangkat, yang penting saat membandingkan file konfigurasi, kredensial, atau kode proprietary.
๐Ÿ“‹
Keluaran siap salin
Keluaran diff menggunakan awalan + / - standar yang sesuai dengan format unified diff. Anda dapat menyalin hasilnya langsung ke pesan commit, komentar code review, atau laporan bug.
๐ŸŒ
Tanpa login atau instalasi
Bekerja di perangkat apa pun dengan browser. Tidak perlu membuat akun, tidak perlu ekstensi, tidak perlu aplikasi desktop. Buka halaman dan mulai membandingkan.

Kasus Penggunaan Text Diff

Frontend Development
Bandingkan keluaran CSS atau HTML yang diminifikasi sebelum dan sesudah proses build untuk menangkap perubahan yang tidak disengaja pada markup atau gaya yang dihasilkan.
Backend Engineering
Bandingkan respons API antar lingkungan (staging vs produksi) untuk memverifikasi bahwa deployment tidak memperkenalkan perubahan data yang tidak terduga.
DevOps & Infrastruktur
Bandingkan manifes Kubernetes, rencana Terraform, atau konfigurasi Nginx sebelum menerapkan perubahan ke kluster atau server yang sedang berjalan.
QA & Pengujian
Verifikasi bahwa keluaran pengujian sesuai dengan baseline yang diharapkan dengan membandingkan hasil aktual terhadap file snapshot yang tersimpan.
Data Engineering
Bandingkan header CSV atau definisi skema SQL antar migrasi database untuk memastikan kolom ditambahkan atau diganti nama dengan benar.
Pembelajaran & Studi
Bandingkan solusi Anda dengan implementasi referensi baris per baris untuk menemukan di mana logika Anda menyimpang dari pendekatan yang diharapkan.

Perbandingan Format Keluaran Diff

Alat diff menghasilkan keluaran dalam beberapa format. Tabel berikut merangkum format yang paling umum, apa yang menghasilkannya, dan kapan masing-masing berguna.

FormatAlat / SumberDeskripsi
Unified diffdiff -u / git diffPrefixes lines with + / - / space; includes @@ hunk headers
Side-by-sidediff -y / sdiffTwo columns, changed lines aligned horizontally
Context diffdiff -cShows changed lines with surrounding context, marked with ! / + / -
HTML diffPython difflibColor-coded HTML table with inline change highlights
JSON PatchRFC 6902Array of add/remove/replace operations on a JSON document

Cara Kerja Line Diff: Algoritma LCS

Sebagian besar alat line-diff, termasuk alat ini, menggunakan algoritma Longest Common Subsequence (LCS). LCS menemukan kumpulan baris terbesar yang muncul di kedua teks dalam urutan relatif yang sama, tanpa mensyaratkan bahwa baris-baris tersebut berdekatan. Baris yang tidak ada di LCS adalah perbedaan yang sebenarnya.

Algoritma LCS standar menggunakan dynamic programming dan berjalan dalam waktu O(m x n), di mana m dan n adalah jumlah baris dari kedua teks. Untuk file besar, varian yang dioptimalkan seperti algoritma diff Myers (digunakan oleh Git) mereduksinya menjadi O(n + d^2) di mana d adalah jumlah perbedaan, sehingga lebih cepat ketika sebagian besar baris sama.

1. Bangun tabel DP
Buat matriks (m+1) x (n+1). Untuk setiap pasang baris, simpan panjang subsequence umum terpanjang yang telah ditemukan. Baris yang sama memperpanjang nilai diagonal sebesar 1.
2. Backtrack
Telusuri dari sudut kanan bawah matriks kembali ke (0,0). Pergerakan diagonal pada baris yang sama menghasilkan entri "tidak berubah". Pergerakan horizontal atau vertikal menghasilkan entri "ditambahkan" atau "dihapus".
3. Tampilkan keluaran
Petakan setiap entri ke baris tampilan: baris yang tidak berubah tidak mendapat awalan, baris yang ditambahkan mendapat +, baris yang dihapus mendapat -. Terapkan kode warna untuk kejelasan visual.

Contoh Kode

Implementasi perbandingan teks baris per baris dalam JavaScript, Python, Go, dan baris perintah. Setiap contoh menghasilkan keluaran berformat unified-style diff.

JavaScript
// Line-by-line diff using the LCS algorithm
function diffLines(a, b) {
  const linesA = a.split('\n')
  const linesB = b.split('\n')

  // Build LCS table
  const m = linesA.length, n = linesB.length
  const dp = Array.from({ length: m + 1 }, () => new Array(n + 1).fill(0))
  for (let i = 1; i <= m; i++)
    for (let j = 1; j <= n; j++)
      dp[i][j] = linesA[i-1] === linesB[j-1]
        ? dp[i-1][j-1] + 1
        : Math.max(dp[i-1][j], dp[i][j-1])

  // Backtrack to produce diff
  const result = []
  let i = m, j = n
  while (i > 0 || j > 0) {
    if (i > 0 && j > 0 && linesA[i-1] === linesB[j-1]) {
      result.unshift({ type: 'equal', text: linesA[i-1] }); i--; j--
    } else if (j > 0 && (i === 0 || dp[i][j-1] >= dp[i-1][j])) {
      result.unshift({ type: 'add', text: linesB[j-1] }); j--
    } else {
      result.unshift({ type: 'remove', text: linesA[i-1] }); i--
    }
  }
  return result
}

const diff = diffLines("alpha\nbeta\ngamma", "alpha\nbeta changed\ngamma\ndelta")
// โ†’ [
//   { type: 'equal',  text: 'alpha' },
//   { type: 'remove', text: 'beta' },
//   { type: 'add',    text: 'beta changed' },
//   { type: 'equal',  text: 'gamma' },
//   { type: 'add',    text: 'delta' }
// ]
Python
import difflib

text_a = """alpha
beta
gamma""".splitlines()

text_b = """alpha
beta changed
gamma
delta""".splitlines()

# Unified diff (same format as git diff)
for line in difflib.unified_diff(text_a, text_b, fromfile='a.txt', tofile='b.txt', lineterm=''):
    print(line)
# --- a.txt
# +++ b.txt
# @@ -1,3 +1,4 @@
#  alpha
# -beta
# +beta changed
#  gamma
# +delta

# HTML side-by-side diff
d = difflib.HtmlDiff()
html = d.make_file(text_a, text_b, fromdesc='Original', todesc='Modified')
Go
package main

import (
	"fmt"
	"strings"
)

// Minimal LCS-based line diff
func diffLines(a, b string) {
	la := strings.Split(a, "\n")
	lb := strings.Split(b, "\n")
	m, n := len(la), len(lb)

	dp := make([][]int, m+1)
	for i := range dp {
		dp[i] = make([]int, n+1)
	}
	for i := 1; i <= m; i++ {
		for j := 1; j <= n; j++ {
			if la[i-1] == lb[j-1] {
				dp[i][j] = dp[i-1][j-1] + 1
			} else if dp[i-1][j] >= dp[i][j-1] {
				dp[i][j] = dp[i-1][j]
			} else {
				dp[i][j] = dp[i][j-1]
			}
		}
	}

	var result []string
	i, j := m, n
	for i > 0 || j > 0 {
		if i > 0 && j > 0 && la[i-1] == lb[j-1] {
			result = append([]string{" " + la[i-1]}, result...)
			i--; j--
		} else if j > 0 && (i == 0 || dp[i][j-1] >= dp[i-1][j]) {
			result = append([]string{"+" + lb[j-1]}, result...)
			j--
		} else {
			result = append([]string{"-" + la[i-1]}, result...)
			i--
		}
	}

	for _, line := range result {
		fmt.Println(line)
	}
}

// Output:
//  alpha
// -beta
// +beta changed
//  gamma
// +delta
CLI (diff / git)
# Compare two files with unified diff (3 lines of context)
diff -u original.txt modified.txt

# Git diff between working tree and last commit
git diff HEAD -- file.txt

# Git diff between two branches
git diff main..feature -- src/

# Side-by-side diff in the terminal
diff -y --width=120 original.txt modified.txt

# Color-coded diff (requires colordiff)
diff -u original.txt modified.txt | colordiff

Pertanyaan yang Sering Diajukan

Apa perbedaan antara line diff dan character diff?
Line diff membandingkan teks baris per baris: jika ada karakter yang berubah pada suatu baris, seluruh baris ditandai sebagai dihapus dan versi baru ditandai sebagai ditambahkan. Character diff (atau word diff) beroperasi pada granularitas yang lebih halus, menandai karakter atau kata spesifik yang berubah dalam sebuah baris. Line diff adalah standar untuk code review; character diff lebih berguna untuk penyuntingan prosa.
Bagaimana cara kerja git diff secara internal?
Git menggunakan algoritma diff Myers secara default, yang menemukan skrip pengeditan terpendek (jumlah minimum penyisipan dan penghapusan) antara dua file. Git menyimpan hasilnya dalam format unified diff dengan header hunk @@ yang menunjukkan nomor baris. Saat menjalankan git diff, Git membandingkan working tree terhadap index (staging area), bukan commit terakhir, kecuali jika Anda meneruskan HEAD secara eksplisit.
Bisakah saya membandingkan file biner dengan alat text diff?
Tidak. Alat text diff membagi masukan pada karakter newline dan membandingkan string. File biner mengandung urutan byte sembarang yang menghasilkan pemisahan baris yang tidak bermakna. Untuk perbandingan biner, gunakan alat hex diff atau perbandingan checksum di tingkat file (sha256sum pada kedua file).
Apakah data saya dikirim ke server saat menggunakan alat ini?
Tidak. Alat ini berjalan sepenuhnya di browser Anda. Perhitungan diff menggunakan implementasi LCS dalam JavaScript yang dieksekusi di sisi klien. Tidak ada permintaan jaringan yang dibuat dengan konten teks Anda. Anda dapat memverifikasi ini dengan membuka tab Network di browser saat menggunakan alat.
Apa itu format unified diff?
Unified diff adalah format keluaran yang digunakan oleh diff -u dan git diff. Format ini menampilkan baris yang diubah dengan awalan - (dihapus) dan + (ditambahkan), didahului oleh header @@ yang menentukan rentang nomor baris di kedua file. Baris konteks (tidak berubah) memiliki awalan spasi. Unified diff adalah format paling umum untuk patch, pull request, dan alat code review.
Bagaimana cara membandingkan file besar dengan banyak perbedaan?
Untuk file dengan ribuan baris, alat berbasis browser dapat bekerja tetapi mungkin melambat karena algoritma LCS berskala kuadratik. Untuk diff yang sangat besar, alat baris perintah seperti diff atau git diff lebih cepat karena menggunakan implementasi C yang dioptimalkan dan dapat mengalirkan keluaran. Anda juga dapat menyaring baris yang tidak berubah (nonaktifkan "Tampilkan baris yang tidak berubah" di alat ini) agar hanya fokus pada perubahan.
Apa itu three-way merge diff?
Three-way merge membandingkan dua versi yang dimodifikasi dari sebuah file terhadap nenek moyang bersama mereka (basis). Git menggunakannya selama git merge dan git rebase. Ini mengidentifikasi perubahan yang dibuat di setiap cabang relatif terhadap basis dan menggabungkannya. Ketika kedua cabang memodifikasi baris yang sama, Git melaporkan konflik merge. Three-way merge memerlukan tiga masukan, sedangkan diff standar hanya memerlukan dua.