JavaScript minifier
Verklein JavaScript-bestanden en zie precies hoeveel je bespaart.
Draait in je browser. Niets van wat je typt wordt ergens naartoe gestuurd.
- Verkort variabelenamen
- Toont bespaarde bytes
- Niets wordt geüpload
Zo minify je JavaScript
- Plak je JavaScript.
- Zet Comprimeren of Variabelenamen verkorten uit als je ze leesbaar wilt houden.
- Kopieer of download het verkleinde bestand.
Wat Comprimeren en Variabelenamen verkorten elk doen
| Optie | Wat het doet |
|---|---|
| Comprimeren | Verwijdert dode code en vereenvoudigt expressies |
| Variabelenamen verkorten | Hernoemt lokale variabelen naar korte namen zoals a, b en c |
Wat sowieso hetzelfde blijft
- Publiek gedrag: dezelfde invoer levert nog steeds dezelfde uitvoer op.
- Elke string in de code, inclusief alle tekst die aan gebruikers wordt getoond.
- De volgorde waarin bewerkingen worden uitgevoerd.
- Een /*! ... */-commentaar, aangezien Terser die stijl standaard behoudt, de conventie die veel bibliotheken gebruiken voor licentiebanners.
Tips voor het minifyen van JavaScript
- Bewaar een niet-geminificeerde kopie, of genereer een source map in je buildtool, zodat productiefouten leesbaar blijven.
- Zet Variabelenamen verkorten uit voor een bibliotheek die andere ontwikkelaars zullen lezen, zodat foutmeldingen betekenisvolle namen behouden.
- Draai tests tegen de verkleinde uitvoer voordat je die uitrolt, want een zeldzaam randgeval in een minifier blijft mogelijk, ook al wordt deze veel gebruikt.
Veelgestelde vragen over JavaScript minifier
Is geminificeerde JavaScript nog steeds geldige code?
Ja. Hij draait precies hetzelfde als het origineel, alleen met kortere namen en zonder extra witruimte.
Hoeveel kleiner wordt JavaScript meestal?
Vaak 30 tot 60 procent kleiner, afhankelijk van hoeveel commentaar en lange variabelenamen het origineel heeft.
Wat gebeurt er als mijn code een syntaxfout heeft?
De fout wordt getoond met de regel en kolom waar hij optrad, zodat je hem kunt herstellen en het opnieuw kunt proberen.
Wat is het verschil tussen Comprimeren en Variabelenamen verkorten?
Comprimeren herschrijft de code om dode takken te verwijderen en expressies te vereenvoudigen. Variabelenamen verkorten hernoemt lokale variabelen naar losse letters. Je kunt elk apart uitzetten.
Kan dit moderne syntax minifyen zoals async en arrow-functies?
Ja, inclusief ES2020 en latere syntax zoals optional chaining en async of await.
Welke minifier gebruikt dit?
Terser, de standaardopvolger van UglifyJS en de minifier die de meeste bundlers, waaronder webpack, Rollup en esbuild, standaard gebruiken.
Kan minifyen mijn code ooit breken?
Bij normale code zou het gedrag niet moeten veranderen. Code die tijdens het draaien de originele naam van een functie of variabele uitleest, bijvoorbeeld via niet-standaard introspectietrucs, kan breken zodra namen verkort zijn. Zet Variabelenamen verkorten uit als dat op jou van toepassing is.
Ondersteunt het TypeScript-syntax?
Nee, dit verwacht gewone JavaScript. De type-annotaties van TypeScript zijn geen geldige JavaScript en veroorzaken hier een syntaxfout, compileer TypeScript dus eerst naar JavaScript.