Minifier for HTML, CSS og JavaScript online
Minifiser HTML, CSS og JavaScript ved å fjerne kommentarer og overflødig mellomrom lokalt i nettleseren.
Slik fungerer minifiseringen
Verktøyet fjerner kommentarer, linjeskift og overflødig mellomrom for å gjøre filene mindre. Alt skjer lokalt i nettleseren, så koden din sendes aldri til en server.
Minifiseringen er regelbasert (regex) og bevisst konservativ. For JavaScript og HTML beholdes nødvendige linjeskift slik at koden fortsatt fungerer. Bruk en dedikert byggeverktøykjede (som esbuild eller terser) for maksimal komprimering i produksjon.
Om dette verktøyet
Minifier komprimerer kildekode ved å fjerne alt som ikke er nødvendig for at datamaskinen skal forstå den: mellomrom, linjeskift, kommentarer og lengre variabelnavn. Resultatet er en fil som gir samme oppførsel, men veier mindre og laster raskere. Dette verktøyet håndterer HTML, CSS og JavaScript direkte i nettleseren, og viser både størrelsen før og etter samt sparingen i prosent. Bruk det når du forbereder statiske sider, e-postmaler eller innebygde HTML-snutter for et CMS som ikke minifiserer selv, eller når du bare vil vite hvor stor gevinst du får før du setter opp en byggekjede.
Slik bruker du det
- Velg språk (HTML, CSS eller JavaScript) i knapperaden på toppen.
- Lim inn koden i venstre panel.
- Se minifisert output i høyre panel, oppdatert i sanntid.
- Trykk «Kopier» eller «Last ned» for å ta med resultatet inn i prosjektet ditt.
Eksempler
.card {
padding: 16px;
/* rounded */
border-radius: 8px;
}.card{padding:16px;border-radius:8px}<div class="hero">
<h1>Hei</h1>
<!-- greeting -->
</div><div class=hero><h1>Hei</h1></div>Vanlige bruksområder
- Redusere størrelsen på statiske filer for raskere lasting.
- Klippe ut kommentarer og tomrom fra kode som limes inn i et nyhetsbrev eller e-post.
- Klargjøre kodesnutter for innsending til Google Tag Manager, HubSpot eller Shopify.
- Klemme HTML-eposttmaler ned under klientspesifikke størrelsesgrenser.
- Sjekke hvor mye du potensielt kan spare før du setter opp Vite/webpack/esbuild.
Ofte stilte spørsmål
- Endrer minifisering oppførselen til koden?
- Nei, ikke hvis den er trygg. Verktøyet gjør bare «safe» transformasjoner: fjerner overflødig whitespace og kommentarer, komprimerer HTML-attributter og forkorter CSS-verdier der spec tillater det. JavaScript endres kun i whitespace, ikke variabelnavn.
- Hva er forskjellen på minifisering og uglifisering?
- Minifisering fjerner unødvendige tegn, mens uglifisering også omdøper variabler til korte navn (a, b, c) og gjør koden vanskeligere å lese. Vi minifiserer bare, for oversiktens skyld, og fordi bygg-verktøy som Terser og esbuild uglifiserer bedre i produksjonsbygg.
- Bør jeg minifisere før eller etter Brotli/Gzip?
- Alltid før. Minifisering fjerner tokens som Brotli/Gzip også ville komprimert, men resultatet er likevel mindre fordi færre unike sekvenser gir bedre kompresjonsmønstre. Gevinsten ligger typisk på 5–20 % ekstra oppå gzip.
- Fungerer verktøyet på TypeScript eller JSX?
- Nei, kun ferdig kompilert JavaScript, standard CSS og HTML. TypeScript og JSX må først transpileres av tsc, esbuild, swc eller Babel.
Teknisk bakgrunn
Minifiseringspipelines består typisk av en parser som bygger et AST, en optimaliseringspass som fjerner uleselige eller unødvendige noder, og en «code generator» som skriver ut resultatet uten formatering. For JavaScript definerer ECMAScript hva som er syntaktisk lovlig, og verktøy som Terser og esbuild bruker det til å eliminere død kode, folde konstanter og inline enkle funksjoner. CSS-minifiserere som cssnano folder farger (#ffffff → #fff), fjerner måleenheter for null (0px → 0) og slår sammen selektorer. HTML-minifiserere fjerner valgfrie sluttagger (</li>, </p>), kollapser boolske attributter og strømlinjeformer whitespace innenfor tekstinnhold. Alle passer må respektere kontekst: <pre> og <textarea> bevarer whitespace, kommentarer med license-headers («!») bør beholdes, og CSS var()/env()-funksjoner må ikke røres.