O ovom alatu
HTML minimiziranje uklanja nepotrebne znakove iz izvora web-stranice — razmake između oznaka, komentara, suvišne navodnike, neobavezne završne oznake — kako bi se smanjila veličina datoteke bez promjene načina na koji se stranica prikazuje. Uštede su skromne po stranici (obično 10–30%), ali se kombiniraju s mnogim zahtjevima, osobito za statične stranice ili stranice koje se poslužuju bez dinamičke kompresije.
Ovaj minifikator uklanja razmake između elemenata na razini bloka, sažima nizove razmaka unutar beznačajnog teksta, uklanja HTML komentare (osim IE uvjetnih komentara), uklanja suvišne navodnike atributa gdje to dopušta HTML5 specifikacija i briše neobavezne završne oznake (</p>, </li>) gdje to specifikacija dopušta. Rezultat se prikazuje identično izvoru u svakom pregledniku.
Minifikacija je najkorisnija kada je uparena s gzip ili Brotli kompresijom na razini poslužitelja. Kompresija već uklanja velik dio uštede koju stvara minimizacija, ali to dvoje u kombinaciji još uvijek pobjeđuje samo kompresiju — osobito za web stranice s velikim prometom gdje su troškovi propusnosti važni.
Zašto smanjiti HTML
Manji HTML učitava se brže, osobito na sporijim vezama i mobilnim mrežama. Težina stranice izravno utječe na temeljne web vitale — Largest Contentful Paint i Time to First Byte poboljšavaju se kada poslužitelj vraća manje HTML-a za analizu. Za web stranice gdje SEO rangiranje ovisi o rezultatima Core Web Vitals, smanjivanje je mjerljivo poboljšanje.
Minificirani HTML također smanjuje troškove propusnosti u velikom broju. Stranica koja poslužuje milijun stranica dnevno s 10 KB uštede po stranici štedi 10 GB izlaza dnevno. Utjecajni spojevi za statične stranice koje poslužuju CDN-ovi koji naplaćuju prijenosom podataka.
Tehnički detalji
Minifikator obrađuje HTML token po token. Praznina između elemenata na razini bloka (<div>, <p>, <ul>) uklanja se jer ne utječe na iscrtavanje. Praznina unutar ugrađenih konteksta (<span>, <a>, tekstualni sadržaj) je sačuvana jer može utjecati na iscrtavanje.
Komentari su uklonjeni prema zadanim postavkama, ali su uvjetni komentari (<!--[if IE]>) sačuvani. Navodnici atributa uklanjaju se tamo gdje HTML5 parser dopušta — vrijednosti atributa od jedne riječi bez razmaka ili posebnih znakova mogu izostaviti navodnike.
Neobavezne završne oznake izostavljene su prema specifikaciji HTML5: </p>, </li>, </td>, i nekoliko drugih se može izostaviti kada ih slijedi srodna oznaka koja implicira njihovo zatvaranje. Ovo je neobično za čitanje, ali valjani HTML5 koji preglednici identično analiziraju.
Često postavljana pitanja
- Što uklanja HTML umanjenje?
- Nepotreban razmak između oznaka, HTML komentari (<!-- -->), neobavezne završne oznake (</li>, </p>, </td>), zadane vrijednosti atributa (type="text" na ulazima) i Booleove vrijednosti atributa (disabled="disabled" → onemogućeno).
- Može li umanjivanje pokvariti moju stranicu?
- Rijetko, ali moguće ako se vaš CSS oslanja na razmake između ugrađenih elemenata ili ako JavaScript koristi innerHTML usporedbe. Uvijek testirajte umanjeni izlaz. Alat prema zadanim postavkama koristi konzervativne postavke.
- Trebam li smanjiti HTML ako koristim okvir kao što je Next.js?
- Većina modernih okvira (Next.js, Nuxt, Angular) automatski umanjuju HTML u produkcijskim verzijama. Ovaj je alat koristan za statične HTML datoteke, predloške e-pošte i projekte bez sustava za izgradnju.
- Umanjuje li ovo i ugrađeni CSS i JavaScript?
- Ovaj se alat fokusira na HTML strukturu. Inline <style> i <script> sadržaji su sačuvani kakvi jesu. Za njih koristite namjenske CSS i JavaScript minifikatore za optimalne rezultate.
- Jesu li neobavezne završne oznake sigurno ukloniti?
- Da po specifikaciji HTML5, iako je rezultat teže čitljiv. Neki timovi onemogućuju ovu transformaciju radi jasnoće, prihvaćajući malu kaznu veličine.
- Je li moj HTML prenesen na poslužitelj?
- Ne. Minifier radi u vašem pregledniku.
- Kako se ovo može usporediti s html-minifier-terser?
- html-minifier-terser je kanonski Node.js HTML minifier i daje malo agresivnije rezultate. Ovaj alat pokriva iste transformacije za korištenje na strani preglednika bez postavljanja međugradnje.
- Trebam li minimizirati uvijek ili selektivno?
- Uvijek za proizvodnju. Nikad za izvorni kod u kontroli verzija; čitljiv HTML u izvoru neophodan je za održavanje.