JavaScript Minifier

Klistra in JavaScript för att krympa koden med Terser: död kod tas bort, namn förkortas och blanktecken försvinner. Syntaxfel visas med exakt rad och kolumn.

Körs i din webbläsareIngen registreringInget laddas upp

Minifierad utdata

Så använder du JavaScript Minifier

  1. Klistra in din JavaScript-kod eller öppna en .js-fil.
  2. Välj alternativ: Mangla namn förkortar lokala variabler, Komprimera skriver om koden till en mindre motsvarighet, ES-modul tillåter import/export på toppnivå.
  3. Välj den ECMAScript-version som dina användares webbläsare stöder. ES2020 är säkert för alla moderna webbläsare.
  4. Kontrollera storlek, besparing och gzip-uppskattning under resultatet.
  5. Kopiera den minifierade koden eller ladda ner den som output.min.js.

Vad gör en JavaScript-minifierare?

Minifiering gör JavaScript mindre utan att ändra vad koden gör. Verktyget använder Terser, minifieraren bakom webpack, Vite och Rollup, och gör tre typer av ändringar:

  • Borttagning av blanktecken och kommentarer: indrag, radbrytningar och kommentarer behövs inte av JavaScript-motorn.
  • Mangling: namn på lokala variabler och funktionsparametrar som subtotal blir enskilda bokstäver. Globala namn och objektegenskaper lämnas orörda så att ditt publika API fortsätter att fungera.
  • Komprimering: konstanta uttryck beräknas i förväg, kod som aldrig nås tas bort, if-satser blir ternära uttryck och korta funktioner infogas direkt.

Minifiering eller gzip: behövs båda?

Ja. Gzip och Brotli komprimerar upprepade bytemönster under överföringen, medan minifiering tar bort byte som webbläsaren annars måste ladda ner, tolka och kompilera. Ett typiskt skript krymper 40–60 % av minifiering och sedan ytterligare 60–70 % av gzip. Gzip-storleken som visas här är en bra uppskattning av vad servern faktiskt skickar.

Behålla licenskommentarer

Många open source-licenser (MIT, BSD, Apache) kräver att upphovsrättsmeddelandet följer med koden. Enligt konvention behålls kommentarer som börjar med /*! eller innehåller @license eller @preserve när Behåll licenskommentarer är aktiverat.

När du inte ska minifiera för hand

Om ditt projekt redan använder en bundler, låt den minifiera produktionsbyggen och generera source maps för felsökning. En minifierare online är perfekt för enstaka skript, kodsnuttar till ett CMS eller en tagghanterare, bookmarklets och för att se hur liten en kodbit kan bli.

Vanliga frågor

Laddas min kod upp till en server?
Nej. Terser körs i din webbläsarflik, så proprietär kod lämnar aldrig din dator.
Kan minifiering förstöra min kod?
Terser gör bara omvandlingar som behåller exakt samma beteende för giltig JavaScript. Kod som förlitar sig på Function.prototype.toString() eller på lokala variabelnamn via eval kan påverkas; stäng i så fall av Mangla namn.
Stöds modern syntax som async/await, klasser och optional chaining?
Ja. Terser tolkar ES2022+-syntax. Målinställningen styr bara vilken syntax resultatet får använda; den transpilerar inte nyare funktioner till äldre.
Vad är skillnaden mellan minify och uglify?
De betyder samma sak. UglifyJS var det klassiska verktyget; Terser är dess underhållna fork med fullt stöd för ES2015+.

Relaterade verktyg

CSS-minifierare Krymp stilmallar: förkorta värden och slå ihop dubblettregler. HTML Minifier Ta bort kommentarer och blanktecken, och minifiera inline CSS/JS. JSON Formatter Formatera, minifiera och validera JSON med fel per rad/kolumn. SQL-formaterare Formatera eller minifiera SQL för PostgreSQL, MySQL, T-SQL, BigQuery m.fl.