Az eszköz betöltése…
Illeszd be a kódot, és megkapod a kisebb változatot a megtakarítással együtt. Óvatosan dolgozunk: a „ :hover” előtti és a calc() + jele körüli szóköz marad, a <pre> és a <script> tartalma érintetlen.
Lépésről lépésre
Illeszd be vagy nyisd meg a .html / .css fájlt; a típust felismerjük.
Kommentek, whitespace, beágyazott <style>, JSON-LD és licenckommentek – egyenként ki-be.
A böngésződ egy háttérszálon dolgozik, így nagy fájlnál sem akad meg az oldal.
Méret előtte-utána, gzip-pel is; másolás vagy letöltés.
GYIK
Igen, ingyenes, és regisztráció nélkül is használhatod. Belépve elmentheted a beállításaidat, és később folytathatod, akár másik gépen is.
Nem. A minifikálás a böngésződben, egy Web Workerben fut; a kód nem hagyja el a gépedet.
Mert némelyik jelentéses. CSS-ben az „a :hover” mást jelent, mint az „a:hover”, a calc(100% - 2rem) szóközei kötelezők, és a stringek, url()-ek tartalmához nem nyúlunk. HTML-ben két inline elem közti szóköz látszik, ezért egy megmarad; blokkelemek között törölhető.
Nem: a <script> tartalma érintetlen marad, mert a JavaScript biztonságos minifikálásához teljes értelmező kell. A JSON-LD-t (ami adat) tömörítjük, biztonságosan.
Kézzel írt, kommentes kódnál gyakran 20–40%-ot, gzip-pel tömörítve kevesebbet. A sebességet sokkal jobban javítja a képek optimalizálása és a jó gyorsítótárazás – a képoptimalizálóval ebben is segítünk.
Eszközök
388 B · legfeljebb 5 MB. A kód nem hagyja el a gépedet: a böngésződ dolgozza fel.
Óvatos minifier: nem nevez át, nem rendez át, a JavaScriptet nem módosítja. Ha egy elem a CSS-ben white-space: pre, annak szövegét a pre-hez hasonlóan érdemes külön kezelni.