Porównywarka tekstu (diff)

Czym jest diff checker?

Diff checker porównuje dwa fragmenty tekstu lub kodu i wyróżnia to, co dodano, usunięto lub zmieniono. Programiści używają diffów bez przerwy: przy przeglądzie kodu, debugowaniu zmian w konfiguracji, porównywaniu odpowiedzi API, sprawdzaniu migracji i rozumieniu zmian przed commitem.

Czytanie diffów to podstawowa umiejętność programisty. Pozwala oddzielić *prawdziwe zmiany zachowania* od niegroźnego formatowania i wypatrzyć jeden zmieniony znak w bloku 200 linii. Gdy przyswoisz rytm zielone / czerwone / żółte, przegląd kodu staje się dużo szybszy.

Najważniejsze są dwa rodzaje diffu: *diff linii* (które linie się zmieniły) oraz *diff słów* lub *diff znaków* (co zmieniło się wewnątrz linii). Dobre narzędzie pozwala przełączać się między nimi w zależności od tego, czy porównujesz kod źródłowy, czy akapity tekstu.

Czego nauczysz się, porównując teksty

• Diff linii pokazuje, *gdzie* zaszły zmiany. Diff słów i znaków pokazuje, *co* zmieniło się w linii.
• Białe znaki mogą mieć znaczenie (Markdown, YAML, Python) albo być bez znaczenia (większość innego kodu), więc odpowiednio przełączaj opcję ignorowania białych znaków.
• Mały z pozoru diff może mieć ogromne skutki, jeśli zmienia wartość, warunek, trasę, zmienną środowiskową albo flagę funkcji.
• Gdy dwa duże bloki bardzo się różnią, najpierw je posortuj lub znormalizuj. Porównanie dwóch nieposortowanych obiektów JSON może dać ścianę fałszywych różnic.

Jak krok po kroku porównać dwa teksty

1. 1

   Wklej obie wersje

   Oryginalny tekst umieść po lewej, a nową wersję po prawej. Kod, JSON, zwykły tekst, pliki konfiguracyjne: wszystko zadziała.

2. 2

   Wybierz diff linii lub słów

   Diffu linii używaj dla kodu źródłowego i danych strukturalnych. Przełącz się na diff słów, gdy porównujesz akapity tekstu, w których liczy się sformułowanie.

3. 3

   Ustaw białe znaki i wielkość liter

   Włącz *ignorowanie białych znaków*, jeśli interesują cię tylko istotne zmiany. Włącz *ignorowanie wielkości liter*, gdy porównujesz logi lub tekst, w którym wielkość liter jest przypadkowa.

4. 4

   Odczytaj kolorowy wynik

   Usunięta treść pojawia się na czerwono po lewej, dodana na zielono po prawej. Zmienione linie często widać jako parę: jedną usuniętą i jedną dodaną obok siebie.

5. 5

   Poprawiaj na bieżąco

   Edytuj dowolną stronę i obserwuj, jak diff aktualizuje się na żywo. To świetny sposób na przygotowanie czystej poprawki przed otwarciem pull requesta.

Ściąga kolorów i symboli diffu

Konwencje używane w diff checkerze Coddy, a także w git diff, GitHubie i większości innych przeglądarek diffów.

Przykłady diffów do wypróbowania

API_TIMEOUT=3000

API_TIMEOUT=30000

{  "id": 42,  "status": "draft",  "published": false}

{  "id": 42,  "status": "published",  "published": true}

function total(items) {  let sum = 0;  for (const i of items) sum += i.price;  return sum;}

function total(items) {  return items.reduce((sum, i) => sum + i.price, 0);}

@@ -1,4 +1,4 @@ function greet(name) {-  return 'Hi ' + name;+  return `Hi ${name}`; }

Częste błędy przy porównywaniu

• Ignorowanie białych znaków, gdy mają znaczenie. Markdown, YAML i Python zwracają uwagę na wcięcia.
• Przeglądanie tylko zielonych (dodanych) linii i przeoczenie ważnych czerwonych (usuniętych).
• Założenie, że czysty diff dowodzi poprawności nowej wersji. Diff pokazuje tylko, *co się zmieniło*, a nie *czy zmiana jest słuszna*.
• Porównywanie zminifikowanego JSON-a ze sformatowanym kodem bez wcześniejszej normalizacji jednego z nich. Każda linia będzie wyglądać inaczej, nawet jeśli dane są takie same.
• Poleganie na diffie obok siebie przy bardzo długich plikach bez szukania konkretnych słów kluczowych. Rób jedno i drugie: najpierw przejrzyj, potem Ctrl+F dla pola, które cię interesuje.

Porównanie tekstu: FAQ