Minify JavaScript betyder at fjerne tegn, som browseren ikke behøver for at udføre koden: mellemrum, linjeskift, kommentarer og i mange tilfælde lange lokale variabelnavne. Resultatet er en mindre produktionsfil med samme funktion. Minification udføres normalt af build-værktøjet eller et cache-/optimeringsplugin, ikke manuelt i kildekoden.
En mindre JavaScript-fil bruger færre bytes på netværket og kan derfor komme hurtigere frem, især på mobilforbindelser. Når filen leveres med Brotli eller Gzip, bliver den overførte størrelse yderligere mindre. Gevinsten er reel, men begrænset: En minified fil, som browseren ikke behøver, er stadig for meget JavaScript.
Hvad minification gør — og ikke gør
Minification forbedrer typisk downloadtiden, men løser ikke tung parsing, kompilering eller eksekvering. En 500 KB bundle med komplekse komponenter, tracking og en slider kan stadig holde hovedtråden optaget, selv om den er perfekt minified. Det kan påvirke responsen på klik og tastatur og dermed Interaction to Next Paint (INP).
Det vigtigste supplement er at reducere ubrugt JavaScript, dele kode efter behov og undgå at indlæse tredjepartsfunktioner, før brugeren har brug for dem. Derudover bør ikke-kritiske scripts få defer eller i enkelte tilfælde async, så de ikke stopper HTML-parseren.
WordPress-vinklen
WordPress core leverer allerede mange JavaScript-filer i minified versioner. Temaer, page builders og plugins er mere varierende. Et optimeringsplugin kan minify temaets og plugins’ filer, men du bør ikke få det til at minify en fil, der allerede er minified, hvis værktøjet blot bruger ekstra CPU uden at reducere noget.
- Aktivér minify i staging først, og ryd alle caches før testen.
- Test kontaktformularer, menu, søgning, cookiesamtykke, login og WooCommerce checkout.
- Bevar source maps eller læsbar udviklingskode i udviklingsmiljøet; fejlfinding i en minified fil er unødigt vanskelig.
- Ekskludér kun den konkrete fejlende fil, og dokumentér hvorfor ekskluderingen findes.
- Undgå at blande minify sammen med vilkårlig filkombination; de er forskellige optimeringer med forskellige risici.
Sådan måler og retter du
Sammenlign den overførte størrelse og load-tid i DevTools Network før og efter minification på samme cache- og netværksprofil. Brug Coverage til at se, om den leverede kode faktisk anvendes, og Performance-panelet til at finde lange JavaScript-opgaver. Google PageSpeed Insights kan pege på unødvendigt JavaScript, men den konkrete fejlretning ligger ofte i pluginvalg eller betinget indlæsning.
Minify er et sikkert grundlag, når det er testet, men prioriter derefter mængde og tidspunkt: Send mindre kode, send den senere når det er muligt, og lad kun funktioner, der er nødvendige for første visning, konkurrere om browserens tid.