JavaScript Minifikátor a Formátovač

Čo je tento nástroj?

JavaScript minifikátor prepíše kód tak, aby bol čo najmenší, pri identickom správaní: skráti názvy premenných a funkcií, kde je to bezpečné, odstráni komentáre a medzery, zloží konštanty a odstráni nedosiahnuteľný kód.

Tento nástroj je postavený na Terseri, minifikátore založenom na AST, ktorý používa webpack, Vite, Rollup a väčšina moderných JavaScript build nástrojov. Keďže skutočne parsuje váš kód namiesto porovnávania vzorov v texte, správne rozlíši operátor delenia od regexového literálu, nepokazí template stringy obsahujúce sekvencie vyzerajúce ako //, a nepremenuje premennú na názov, ktorý koliduje s niečím vo vonkajšom scope.

Prečo ho používať?

• Minifikácia založená na AST (Terser), rovnaký engine, aký používajú hlavné bundlery — bezpečný pri regexových literáloch, template stringoch a closures.
• Skracuje názvy premenných pre skutočnú úsporu veľkosti, nielen odstránenie medzier.
• Presne uvidíte, koľko bajtov a aké percento ste ušetrili.
• Režim Format zmení obfuskovaný, jednoriadkový minifikovaný JS späť na čitateľný, odsadený kód — užitočné pri pochopení skriptov tretích strán.
• 100% lokálne spracovanie — proprietárny kód nikdy neopustí váš prehliadač.

Ako sa používa

1. Vložte svoj JavaScript do vstupného poľa, alebo kliknite na "Load Example" pre vyskúšanie ukážky s regexovým literálom a template stringom.
2. Kliknite na "Minify" pre kompresiu, alebo "Format" pre naformátovanie s 2-medzerovým odsadením.
3. Skontrolujte správu pod poľami — režim minify ukáže zmenšenie veľkosti; syntaktická chyba vo vašom kóde zobrazí jasnú správu namiesto tichého vytvorenia poškodeného výstupu.
4. Kliknite na "Copy" pre skopírovanie výsledku.

Príklad

Vstup

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

Výstup

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

Názvy premenných sú skrátené, komentár a if-príkaz sú zložené do výrazu, ale regexový literál a template string sú zachované presne a správanie je nezmenené.

Praktické tipy

• Minifikujte v čase buildu, nie ručnou úpravou — čitateľný zdrojový kód si nechajte vo verzovacom systéme a minifikovaný bundle generujte ako krok buildu.
• Ak sa minifikovaný výstup správa neočakávane, skontrolujte kód spoliehajúci sa na Function.prototype.name alebo reflexiu — skrátenie premenúva funkcie a to sa môže prejaviť v zriedkavých okrajových prípadoch.
• Formátovanie skriptu tretej strany pred jeho čítaním je oveľa rýchlejšie ako pokus o parsovanie jedného 2 000-znakového riadku.
• Skombinujte s HTML a CSS minifikátormi nižšie, ak pripravujete kompletný statický bundle na nasadenie.

Kde sa to hodí v reálnych workflow

JavaScript je zvyčajne najväčší asset blokujúci vykreslenie alebo parsovanie na stránke, takže jeho minifikácia má reálny, merateľný vplyv na čas načítania — viac než HTML alebo CSS bajt za bajt. Väčšina moderných frameworkov to robí automaticky v čase buildu, ale ručne písané skripty, rozšírenia prehliadača a bookmarklety sa často nasadzujú neminifikované, pokiaľ ich niekto neprehnie cez nástroj ako tento.

Smer Format sa bežne používa aj opačne: ladenie produkčnej chyby z minifikovaného stack trace je oveľa jednoduchšie, keď je okolitý kód preformátovaný a čitateľný, aj bez pôvodných názvov premenných.

→ HTML Minifikátor · CSS Minifier

Bežné prípady použitia

• Zoštíhlenie samostatného skriptu alebo bookmarkletu pred jeho publikovaním.
• Preformátovanie minifikovaného skriptu vytiahnutého zo živej stránky kvôli pochopeniu, čo robí.
• Vyčistenie JavaScriptu vloženého z príspevku na fóre alebo AI-generovaného úryvku pred jeho pozorným čítaním.
• Rýchla kontrola, či ručne písaný JS úryvok obsahuje syntaktickú chybu, keďže chyba parsovania sa prejaví ako explicitná správa.

Časté otázky