Porównywarka kodu (diff)
Porównaj dwie wersje kodu obok siebie lub w jednej kolumnie, z podświetlaniem składni, numerami wierszy, opcjami białych znaków i plikiem diff.
Jak porównać dwa fragmenty kodu
- Wklej starą wersję w pole Kod oryginalny, a nową w pole Kod zmieniony.
- Wybierz Język albo zostaw Wykryj automatycznie: narzędzie zgadnie język na podstawie kodu i pokaże go obok statystyk.
- Wybierz Widok: Obok siebie lub W jednej kolumnie (unified).
- Ustaw potrzebne opcje: Ignoruj białe znaki i wcięcia, Ignoruj wielkość liter, Wyróżnij zmienione słowa oraz Pokaż tylko zmiany (3 wiersze kontekstu).
- Kliknij Porównaj. Po pierwszym porównaniu wynik aktualizuje się na bieżąco podczas edycji.
- Kliknij Kopiuj jako unified diff lub Pobierz .diff, aby wykorzystać zmianę jako łatkę (patch).
Przycisk Zamień strony zamienia obie wersje miejscami, przez co dodania stają się usunięciami i odwrotnie.
Jak czytać wynik porównania
Usunięte wiersze mają czerwone tło i należą do oryginału, a dodane – zielone i należą do nowej wersji. Każdy wiersz zachowuje numer ze swojego pliku, więc od razu przejdziesz do niego w edytorze.
- Obok siebie pokazuje oba pliki w dwóch ponumerowanych kolumnach. Zmodyfikowany wiersz stoi obok swojej nowej wersji. Z opcją Wyróżnij zmienione słowa zaznaczane są słowa, które zmieniły się w tym wierszu; bez niej oba wiersze zachowują pełne kolory składni.
- W jednej kolumnie (unified) wyświetla jedną kolumnę, jak w code review: w każdym zmienionym bloku najpierw są usunięte wiersze (−), potem dodane (+), z numerami starego i nowego wiersza.
- Pokaż tylko zmiany (3 wiersze kontekstu) zwija długie niezmienione fragmenty do znacznika „⋯ niezmienione wiersze: N”, co znacznie ułatwia przeglądanie dużych plików.
Wiersz statystyk podaje liczbę dodanych, usuniętych i niezmienionych wierszy.
Podświetlanie składni
Podświetlanie odbywa się w twojej przeglądarce za pomocą highlight.js. Gramatyka wybranego języka jest wczytywana dopiero przy pierwszym porównaniu, dzięki czemu strona pozostaje lekka. Obsługiwane języki to m.in. JavaScript, TypeScript, Python, Java, C#, C / C++, Go, Rust, PHP, Ruby, CSS, HTML / XML, JSON, YAML, SQL, Bash / Shell i Markdown. Automatyczne wykrywanie opiera się na prostych wskazówkach (słowa kluczowe, nawiasy, parsowanie JSON); jeśli się pomyli, wybierz język samodzielnie albo ustaw Zwykły tekst.
Białe znaki, wcięcia i końce wierszy
Ignoruj białe znaki i wcięcia porównuje wiersze po obcięciu spacji na brzegach i scaleniu ciągów spacji i tabulatorów, więc plik przeformatowany z 2 na 4 spacje albo z tabulatorów na spacje nie pokaże różnic. Końce wierszy Windows (CRLF) i Unix (LF) są normalizowane przed porównaniem, dlatego plik, w którym zmieniły się tylko końce wierszy, jest zgłaszany jako identyczny. Pamiętaj, że białe znaki mają znaczenie w Pythonie, YAML-u i plikach Makefile: wyłącz tę opcję, gdy wcięcia są istotne.
Format unified diff
Eksportowana łatka używa standardowego formatu unified, który czytają git apply, patch i narzędzia do code review: nagłówek z nazwami dwóch plików, a potem bloki (hunks) zaczynające się od @@ -a,b +c,d @@ z trzema wierszami kontekstu wokół każdej zmiany. Pliki nazywają się original i changed i mają rozszerzenie odpowiednie dla języka.
Najczęściej zadawane pytania
Czy mój kod jest wysyłany na serwer?
Nie. Porównanie i podświetlanie działają lokalnie w twojej przeglądarce; kod nigdy nie opuszcza twojego urządzenia.
Czym to narzędzie różni się od porównywarki tekstu?
Korzysta z tego samego mechanizmu porównywania wiersz po wierszu, ale dodaje podświetlanie składni, widok unified, zwijanie kontekstu i obsługę białych znaków dopasowaną do kodu.
Dlaczego dwa wiersze są oznaczone jako zmienione, choć wyglądają tak samo?
Prawdopodobnie różnią się niewidocznymi znakami: spacjami na końcu, tabulatorami zamiast spacji albo twardą spacją. Zaznacz Ignoruj białe znaki i wcięcia, aby to sprawdzić.
Czy pobraną łatkę mogę zastosować w Git?
Tak. Zapisz ją i uruchom patch original.js < changes.diff albo dostosuj nazwy plików w nagłówku i użyj git apply.
Jak duże mogą być fragmenty kodu?
Kilka tysięcy wierszy porównuje się szybko. Jeśli dwa bardzo duże pliki całkowicie się różnią, narzędzie przerywa pracę po kilku sekundach i prosi o porównanie mniejszych części.
Podobne narzędzia
- Porównywanie tekstów Porównaj dwa teksty i zobacz każdą różnicę obok siebie lub w jednym tekście, według linii, słów lub znaków. Prywatne narzędzie diff w przeglądarce.
- Formatowanie i walidacja JSON Darmowe narzędzie do formatowania i walidacji JSON: upiększa, minifikuje i sprawdza JSON w przeglądarce, wskazując wiersz i kolumnę błędu.
- Tester wyrażeń regularnych Testuj wyrażenia regularne JavaScript na żywo z podświetlaniem dopasowań, grupami przechwytującymi, zamianą tekstu i objaśnieniem każdego elementu wzorca.