Minifikace běží celá v prohlížeči — kód se nikam neodesílá.
Výsledek se přepočítá sám krátce po zastavení psaní.
Jak nástroj použít
- Vyberte jazyk: CSS, JavaScript, nebo HTML.
- Vložte kód do vstupního pole.
- Výsledek i úspora se přepočítají okamžitě, včetně velikosti po gzipu.
- U JavaScriptu můžete vypnout zkracování názvů proměnných nebo nechat licenční komentáře.
Minifikace versus gzip: co ušetří víc
Minifikace kód přepíše, gzip ho jen zabalí na cestu. Efekty se sčítají. Minifikace zdrojový kód přepíše: odstraní komentáře a mezery, zkrátí názvy proměnných. Výsledek je pořád platný kód, jen kratší. Gzip pak ten kód zabalí při přenosu a prohlížeč si ho rozbalí.
Právě proto nástroj ukazuje obě čísla. Sama minifikace u CSS obvykle ubere pár desítek procent, ale rozhodující je velikost po gzipu, protože tu server skutečně posílá. Někdy je rozdíl menší, než by se z ušetřených bajtů zdálo: minifikace odstraní opakující se mezery, na kterých gzip vydělával, takže výsledný rozdíl je menší, než by se z úspory v bajtech zdálo.
Minifikujte vždy, posuzujte podle gzipu.
Co dělá volba mangle
Mangle zkracuje názvy lokálních proměnných a parametrů na jedno nebo dvě písmena. Z function spocitejCenu(polozka) se stane function s(o). Na chování kódu to nemá vliv, protože jde o názvy viditelné jen uvnitř funkce.
Vypnout ho má smysl ve dvou případech: když chcete výsledek ještě číst a když se kód spoléhá na jméno funkce nebo proměnné za běhu, například přes Function.name nebo dynamický přístup k vlastnosti. Takový kód se manglováním rozbije.
Licenční komentáře, které musí zůstat
Knihovny pod licencemi jako MIT nebo Apache vyžadují, aby si text licence nesla i distribuovaná verze. Takové komentáře se značí /*! nebo obsahují slovo @license. Když je minifikace smaže, dostanete se do rozporu s licencí.
Nástroj proto umí licenční komentáře zachovat a ostatní odstranit. U cizího kódu tuhle volbu nechte zapnutou.
U HTML je minifikace záměrně opatrná
V HTML nese mezera mezi značkami význam. Mezi dvěma <span> se zobrazí jako skutečná mezera mezi slovy, takže její odstranění slepí text dohromady. Nástroj proto ruší jen mezery na místech, kde bylo ve zdroji zalomení řádku.
Obsah značek pre, textarea, script a style zůstává nedotčený. Úspora je tím menší než u agresivních minifikátorů, ale výsledek se vykreslí stejně jako originál.
Časté otázky
O kolik se soubor minifikací zmenší?
Záleží na tom, kolik kód obsahoval komentářů a odsazení. U CSS bývá úspora přibližně 20 až 30 procent, u JavaScriptu se zapnutým manglováním i víc. Nástroj vypíše přesné číslo pro váš konkrétní kód.
Odešle se kód na server?
Ne. Minifikace běží v prohlížeči, kód nikam neodchází.
Jde minifikovaný kód vrátit do čitelné podoby?
Formátování ano, ale původní názvy proměnných se po manglování nevrátí, protože se v kódu už nikde nevyskytují. Komentáře jsou taky nenávratně odstraněné. Proto si vždy nechte původní zdroj.
Opačným směrem pracují HTML beautifier, JSON formátovač a SQL formátovač.