Minifikace
Minifikace je proces odstraňování nepotřebných znaků ze zdrojového kódu, jako jsou mezery, komentáře a dlouhé názvy proměnných, bez změny funkčnosti, který zmenšuje velikost souboru pro rychlejší načítání.
Když vývojáři píší kód, používají mezery, odsazení, popisné názvy proměnných a komentáře, aby byl čitelný. Prohlížeče nic z toho nepotřebují. Minifikace tyto prvky určené pro člověka odstraňuje ze souborů CSS, JavaScriptu a HTML, čímž vznikají menší soubory, které se rychleji načítají a zpracovávají.
Soubor JavaScriptu o velikosti 500 KB se může minifikovat na 150 KB, snížení o 70 %. Minifikace CSS odstraňuje komentáře, mezery a nadbytečná deklarace. Může také slučovat zkrácené vlastnosti, spojovat shodné selektory a odstraňovat nepoužívané prefixy prohlížečů.
V praxi
- Balíček JavaScriptu webové aplikace se po minifikaci zmenšil z 1,2 MB na 340 KB a po kompresi gzip na 95 KB, načítá se za méně než 1 sekundu na síti 3G
- Web na WordPressu nainstaloval plugin pro minifikaci a zlepšil skóre PageSpeed Insights o 15 bodů pouze díky minifikaci CSS a JS
- CSS dashboardu SaaS mělo neminifikované 280 KB, po minifikaci a odstranění nepoužívaných stylů kleslo na 18 KB, čímž došlo k eliminaci zpoždění blokujících vykreslování
- Vývojář omylem nasadil do produkce neminifikovaný kód, což zdvojnásobilo dobu načítání stránky, jeho CI/CD pipeline byl upraven, aby se to už neopakovalo
Nejste si jistí, jak se to týká vás?
Zkušený inženýr projde váš web, vaši viditelnost ve vyhledávání a způsob, jakým se k vám dostávají poptávky, a poté sepíše tři věci, které je vhodné opravit jako první. Dokument si ponecháte tak jako tak.
