Porovnání kódu online
Porovnání kódu zdarma
Máte dvě verze funkce a nevíte co se změnilo? Tady to porovnáte i se syntax highlightingem.
Tip: Použijte Ctrl+Enter pro rychlé porovnání
Kdy to přijde vhod?
👀 Když dělám code review
Kolega mi poslal funkci přes Slack s tím že "trochu upravil logiku". Jenže ta funkce má 80 řádků a já potřebuju vidět co přesně změnil. V gitu to nemám, takže sem hodím obě verze a za vteřinu vím.
Taky to používám když porovnávám řešení ze Stack Overflow - hodím tam obě odpovědi a vidím rozdíly.
🐛 Když hledám co to rozbilo
Včera to fungovalo, dneska ne. Mám zálohu funkčního stavu a aktuální verzi. Hodím to sem a syntax highlighting mi pomůže vidět změny v kontextu - ne jako holý diff v terminálu.
Funguje to i pro configy - porovnám produkční a lokální verzi a hned vidím co je jinak.
Podporované programovací jazyky
Funkce nástroje
Zvýraznění syntaxe
Kód vypadá jako ve VS Code nebo jiném editoru. Klíčová slova, stringy, komentáře - vše barevně.
Rozpoznání jazyka
Vložíte kód a nástroj sám pozná jestli je to Python, JavaScript nebo třeba Rust. Nemusíte nic vybírat.
Přehled změn
Rychlý souhrn: kolik řádků přibylo, kolik zmizelo. Hned víte jak velká ta změna vlastně je.
Drag & drop
Přetáhněte soubor přímo z průzkumníka. Funguje to i s .py, .js, .tsx nebo jakýmkoli jiným zdrojákem.
Lokální zpracování
Kód nikam neodesílám. Celé porovnání proběhne přímo ve vašem prohlížeči.
Kopírování výsledku
Výsledek si můžete zkopírovat do schránky nebo stáhnout jako soubor pro pozdější použití.
Jak na to?
Připravte si dva kusy kódu
Funkce, třída, celý soubor - cokoliv. Jazyk poznám sám, nemusíte nic nastavovat.
Vložte do editorů
Vlevo starší verze, vpravo novější. Můžete přetáhnout soubory nebo Ctrl+V.
Koukněte na rozdíly
Se syntax highlightingem je to přehledné - hned vidíte co se změnilo a jak to zapadá do kontextu.
Ukázka: Refaktoring funkce
Typický případ - potřebuju vidět co přesně kolega změnil v té funkci:
Původní verze
function getUser(id) {
const user = db.find(id);
if (user == null) {
return null;
}
return user;
}Po refaktoringu
async function getUser(id) {
const user = await db.findById(id);
if (!user) {
throw new NotFoundError();
}
return user;
}Co se změnilo:
- Změna: Funkce je teď async
- Změna: db.find → db.findById (přejmenování metody)
- Změna: Místo return null teď hází error
- Novinka: await před voláním databáze
Otázky na které se ptáte
Proč ne prostě git diff v terminálu?
Git diff potřebuje repozitář. Když porovnávám kód ze Stack Overflow, z dokumentace, nebo mi ho někdo poslal přes chat - tak git nemám. Tady to prostě vložím a hotovo. Navíc s barevným zvýrazněním syntaxe se změny líp čtou než v plain text diffu.
Zvládne to i větší soubory?
Běžné zdrojáky (jednotky tisíc řádků) jdou v pohodě. Obří soubory bych radši řešil v gitu, ale pro 90 % případů co řeším denně to stačí bohatě.
Co když mám nějaký méně obvyklý jazyk?
Podporuju víc než 20 jazyků včetně Rustu, Kotlinu nebo Scaly. Kdyby něco chybělo, diff samotný pořád funguje - jen nebude barevné zvýraznění. A můžete mi napsat co přidat.
Je to bezpečné pro firemní kód?
Vše běží lokálně v prohlížeči. Kód nikam neposílám, neloguji, neukládám. Můžete sem klidně hodit i věci s API klíči - z vašeho počítače to nikdy neodejde.
Článek na blogu
Sepsal jsem podrobnější rozbor toho, kdy se vyplatí git diff a kdy je lepší použít online nástroj. Plus pár tipů jak dělat code review efektivněji.
Porovnání kódu pro programátory→Další nástroje pro porovnávání
Osobní poznámka
Jednou jsem strávil hodinu hledáním bugu v legacy kódu. Nakonec jsem zjistil, že někdo změnil jednu podmínku z "větší než" na "větší nebo rovno". Kdyby mi to ukázal diff se zvýrazněním, našel bych to za minutu.
Od té doby používám diff nástroje na všechno. Jenže git diff v terminálu je pro code review trochu strohý - chybí mi barvy syntaxe. A online nástroje? Buď chtějí registraci, nebo mají reklam víc než obsahu.
Tak jsem si udělal vlastní. Podporuje JavaScript, TypeScript, Python, Java, C#, Go, Rust a dalších 15 jazyků. Jazyk rozpozná sám, takže stačí vložit kód a koukat.
Pokud vás zajímá víc, na blogu píšu o porovnávání kódu i jiných věcech. A kdyby něco nefungovalo, dejte vědět přes kontakt.