JavaScript-minifier og formaterer

Hvad er dette værktøj?

En JavaScript-minifier omskriver kode, så den bliver så lille som muligt, mens den opfører sig identisk: den forkorter variabel- og funktionsnavne, hvor det er sikkert, fjerner kommentarer og mellemrum, folder konstanter og eliminerer uopnåelig kode.

Dette værktøj er bygget på Terser, den AST-baserede minifier, der bruges af webpack, Vite, Rollup og de fleste moderne JavaScript-byggeværktøjer. Fordi den rent faktisk parser din kode i stedet for at mønstermatche tekst, kan den korrekt skelne en divisionsoperator fra en regex-literal, undgår at ødelægge template-strenge, der indeholder //-lignende sekvenser, og omdøber ikke en variabel til et navn, der kolliderer med noget i et ydre scope.

Hvorfor bruge det?

• AST-baseret minificering (Terser), samme motor som store bundlere bruger — sikker med regex-literaler, template-strenge og closures.
• Forkorter variabelnavne for reelle størrelsesbesparelser, ikke bare fjernelse af mellemrum.
• Se præcis hvor mange bytes og hvilken procentdel du sparede.
• Formateringstilstand gør obfuskeret, enkeltlinjet minificeret JS læsbar og indrykket igen — nyttigt til at forstå tredjeparts-scripts.
• 100% lokal behandling — proprietær kode forlader aldrig din browser.

Sådan bruger du det

1. Indsæt din JavaScript i inputboksen, eller klik "Load Example" for at prøve et eksempel med en regex-literal og en template-streng.
2. Klik "Minify" for at komprimere den, eller "Format" for at gøre den læsbar med 2-mellemrums indrykning.
3. Tjek beskeden under boksene — minify-tilstand viser størrelsesreduktionen; en syntaksfejl i din kode viser en klar besked i stedet for stille at producere ødelagt output.
4. Klik "Copy" for at hente resultatet.

Eksempel

Input

function greet(name) {
  const pattern = /^[a-z]+$/i;
  const msg = `Hello, ${name}!`;
  if (pattern.test(name)) {
    // simple check
    return msg;
  }
  return "Hi there";
}

Output

function greet(n){const e=/^[a-z]+$/i,g=`Hello, ${n}!`;return e.test(n)?g:"Hi there"}

Variabelnavne forkortes, kommentaren og if-sætningen slås sammen til et udtryk, men regex-literalen og template-strengen bevares præcist, og adfærden ændres ikke.

Praktiske tips

• Minificer ved byggetid, ikke ved håndredigering — hold læsbar kildekode under versionsstyring og generér den minificerede bundle som et byggetrin.
• Hvis minificeret output opfører sig uventet, tjek for kode, der er afhængig af Function.prototype.name eller refleksion — navneforkortelse omdøber funktioner, og det kan vise sig i sjældne edge cases.
• At formatere et tredjeparts-script før man læser det er meget hurtigere end at prøve at parse en enkelt 2000-tegns linje.
• Kombiner med HTML- og CSS-minifierne nedenfor, hvis du klargør en fuld statisk bundle til udrulning.

Hvor dette passer ind i den virkelige verden

JavaScript er som regel det største render-blokerende eller parse-blokerende asset på en side, så minificering af den har en reel, målbar effekt på indlæsningstid — mere end HTML eller CSS byte for byte. De fleste moderne frameworks gør dette automatisk ved byggetid, men håndskrevne scripts, browserudvidelser og bogmærke-scripts sendes ofte uminificerede, medmindre nogen kører dem gennem et værktøj som dette.

Format-retningen bruges ofte den modsatte vej: at fejlfinde en produktionsfejl fra et minificeret stack trace er meget nemmere, når den omkringliggende kode er omformateret og læsbar, selv uden de oprindelige variabelnavne.

→ HTML-minifikator · CSS Minifier

Almindelige brugsscenarier

• Formindske et selvstændigt script eller bogmærke-script før udgivelse.
• Omformatere et minificeret script hentet fra en live hjemmeside for at forstå, hvad det gør.
• Rydde op i JavaScript indsat fra et forumindlæg eller AI-genereret snippet, før den læses grundigt.
• Hurtigt tjekke om en håndskrevet JS-snippet har en syntaksfejl, da en parse-fejl vises som en eksplicit besked.

Ofte stillede spørgsmål