Minifikácia
Minifikácia je proces odstraňovania nepotrebných znakov zo zdrojového kódu, ako bielych miest, komentárov a dlhých názvov premenných, bez zmeny funkčnosti, čím sa zmenšuje veľkosť súboru pre rýchlejšie načítanie.
Keď vývojári píšu kód, používajú medzery, odsadenie, popisné názvy premenných a komentáre, aby bol čitateľný. Prehliadače to nepotrebujú. Minifikácia odoberá tieto pre ľudí prívetivé prvky zo súborov CSS, JavaScriptu a HTML, čím produkuje menšie súbory, ktoré sa načítavajú a parsovia rýchlejšie.
Súbor JavaScriptu veľkosti 500 KB sa môže po minifikácii zmenšiť na 150 KB, ide o 70% redukciu. Minifikácia CSS odstraňuje komentáre, medzery a redundatné deklarácie. Môže tiež kombinovať vlastnosti v skratke, zlúčiť identické selektory a odstrániť nepoužité vendor prefixy.
V praxi
- JavaScriptový balík webovej aplikácie sa po minifikácii zmenšil z 1,2 MB na 340 KB a po gzip kompresii na 95 KB, načítal sa za menej ako 1 sekundu na 3G
- Webová stránka WordPress nainštalovala plugin na minifikáciu a zlepšila skóre PageSpeed Insights o 15 bodov len samotnou minifikáciou CSS a JS
- CSS dashboardu SaaS malo 280 KB neominifikovaných, po minifikácii a vyčistení nepoužitých štýlov kleslo na 18 KB, čím sa eliminovali oneskorenia blokujúce vykresľovanie
- Vývojár náhodou nasadil neominifikovaný kód do produkcie, čo spôsobilo zdvojnásobenie času načítania stránky, ich CI/CD pipeline bola aktualizovaná, aby sa tomu zabránilo nabudúce
Nie ste si istí, či sa to týka aj vás?
Senior inžinier prejde vaše stránky, vašu prítomnosť vo vyhľadávaní a spôsob, akým dotazy k vám prichádzajú, a potom zapíše tri veci, ktoré sa oplatí opraviť ako prvé. Dokument si necháte v každom prípade.