Skip to content

Bun include un veloce minifier JavaScript e TypeScript che può ridurre le dimensioni dei bundle dell'80% o più (dipendendo dal codebase) e far eseguire il codice di output più velocemente. Il minifier esegue dozzine di ottimizzazioni inclusi constant folding, dead code elimination, e trasformazioni di sintassi. A differenza di altri minifier, il minifier di Bun fa eseguire bun build più velocemente poiché c'è meno codice da stampare.

Uso CLI

Abilita tutta la minificazione

Usa il flag --minify per abilitare tutte le modalità di minificazione:

bash
bun build ./index.ts --minify --outfile=out.js

Il flag --minify abilita automaticamente:

  • Minificazione whitespace
  • Minificazione sintassi
  • Minificazione identificatori

Modalità production

Il flag --production abilita automaticamente la minificazione:

bash
bun build ./index.ts --production --outfile=out.js

Il flag --production anche:

  • Imposta process.env.NODE_ENV a production
  • Abilita l'import & transform JSX production-mode

Controllo granulare

Puoi abilitare modalità di minificazione specifiche individualmente:

bash
# Rimuovi solo whitespace
bun build ./index.ts --minify-whitespace --outfile=out.js

# Minifica solo la sintassi
bun build ./index.ts --minify-syntax --outfile=out.js

# Minifica solo gli identificatori
bun build ./index.ts --minify-identifiers --outfile=out.js

# Combina modalità specifiche
bun build ./index.ts --minify-whitespace --minify-syntax --outfile=out.js

API JavaScript

Quando usi il bundler di Bun programmaticamente, configura la minificazione attraverso l'opzione minify:

ts
await Bun.build({
  entrypoints: ["./index.ts"],
  outdir: "./out",
  minify: true, // Abilita tutte le modalità di minificazione
});

Per controllo granulare, passa un oggetto:

ts
await Bun.build({
  entrypoints: ["./index.ts"],
  outdir: "./out",
  minify: {
    whitespace: true,
    syntax: true,
    identifiers: true,
  },
});

Modalità di Minificazione

Il minifier di Bun ha tre modalità indipendenti che possono essere abilitate separatamente o combinate.

Minificazione whitespace (--minify-whitespace)

Rimuove tutti i whitespace, newline, e formattazione non necessari dall'output.

Minificazione sintassi (--minify-syntax)

Riscrive la sintassi JavaScript in forme equivalenti più corte ed esegue constant folding, dead code elimination, e altre ottimizzazioni.

Minificazione identificatori (--minify-identifiers)

Rinomina variabili locali e nomi di funzione a identificatori più corti usando ottimizzazione basata sulla frequenza.

Tutte le Trasformazioni

Accorciamento letterali booleani

Modalità: --minify-syntax

Converte i letterali booleani in espressioni più corte.

ts
true
false
js
!0
!1

Ottimizzazioni algebra booleana

Modalità: --minify-syntax

Semplifica le espressioni booleane usando regole logiche.

ts
!!x
x === true
x && true
x || false
!true
!false
js
x
x
x
x
!1
!0

Accorciamento undefined

Modalità: --minify-syntax

Rimpiazza undefined con equivalente più corto.

ts
undefined
let x = undefined;
js
void 0
let x=void 0;

Ottimizzazione uguaglianza undefined

Modalità: --minify-syntax

Ottimizza i controlli di uguaglianza loose con undefined.

ts
x == undefined
x != undefined
js
x == null
x != null

Accorciamento Infinity

Modalità: --minify-syntax

Converte Infinity in espressioni matematiche.

ts
Infinity
-Infinity
js
1/0
-1/0

Ottimizzazioni typeof

Modalità: --minify-syntax

Ottimizza i confronti typeof e valuta le espressioni typeof costanti.

ts
typeof x === 'undefined'
typeof x !== 'undefined'
typeof require
typeof null
typeof true
typeof 123
typeof "str"
typeof 123n
js
typeof x>'u'
typeof x<'u'
"function"
"object"
"boolean"
"number"
"string"
"bigint"

Formattazione numeri

Modalità: --minify-syntax

Formatta i numeri nella rappresentazione più compatta.

ts
10000
100000
1000000
1.0
-42.0
js
1e4
1e5
1e6
1
-42

Constant folding aritmetico

Modalità: --minify-syntax

Valuta le operazioni aritmetiche a compile time.

ts
1 + 2
10 - 5
3 * 4
10 / 2
10 % 3
2 ** 3
js
3
5
12
5
1
8

Constant folding bitwise

Modalità: --minify-syntax

Valuta le operazioni bitwise a compile time.

ts
5 & 3
5 | 3
5 ^ 3
8 << 2
32 >> 2
~5
js
1
7
6
32
8
-6

Concatenazione stringhe

Modalità: --minify-syntax

Combina i letterali di stringa a compile time.

ts
"a" + "b"
"x" + 123
"foo" + "bar" + "baz"
js
"ab"
"x123"
"foobarbaz"

Indicizzazione stringhe

Modalità: --minify-syntax

Valuta l'accesso ai caratteri delle stringhe a compile time.

ts
"foo"[2]
"hello"[0]
js
"o"
"h"

Constant folding template literal

Modalità: --minify-syntax

Valuta i template literal con espressioni costanti.

ts
`a${123}b`
`result: ${5 + 10}`
js
"a123b"
"result: 15"

Conversione template literal a stringa

Modalità: --minify-syntax

Converte i template literal semplici in stringhe regolari.

ts
`Hello World`
`Line 1
Line 2`
js
"Hello World"
"Line 1\nLine 2"

Ottimizzazione quote stringhe

Modalità: --minify-syntax

Sceglie il carattere quote ottimale per minimizzare gli escape.

ts
"It's a string"
'He said "hello"'
`Simple string`
js
"It's a string"
'He said "hello"'
"Simple string"

Inlining array spread

Modalità: --minify-syntax

Inlines le operazioni array spread con array costanti.

ts
[1, ...[2, 3], 4]
[...[a, b]]
js
[1,2,3,4]
[a,b]

Indicizzazione array

Modalità: --minify-syntax

Valuta l'accesso agli array costanti a compile time.

ts
[x][0]
['a', 'b', 'c'][1]
['a', , 'c'][1]
js
x
'b'
void 0

Ottimizzazione accesso proprietà

Modalità: --minify-syntax

Converte la notazione bracket in dot notation quando possibile.

ts
obj["property"]
obj["validName"]
obj["123"]
obj["invalid-name"]
js
obj.property
obj.validName
obj["123"]
obj["invalid-name"]

Constant folding confronti

Modalità: --minify-syntax

Valuta i confronti costanti a compile time.

ts
3 < 5
5 > 3
3 <= 3
5 >= 6
"a" < "b"
js
!0
!0
!0
!1
!0

Constant folding operazioni logiche

Modalità: --minify-syntax

Semplifica le operazioni logiche con valori costanti.

ts
true && x
false && x
true || x
false || x
js
x
!1
!0
x

Constant folding nullish coalescing

Modalità: --minify-syntax

Valuta il nullish coalescing con valori conosciuti.

ts
null ?? x
undefined ?? x
42 ?? x
js
x
x
42

Semplificazione espressioni comma

Modalità: --minify-syntax

Rimuove le espressioni senza side-effect dalle sequenze comma.

ts
(0, x)
(123, "str", x)
js
x
x

Constant folding condizionale ternario

Modalità: --minify-syntax

Valuta le espressioni condizionali con condizioni costanti.

ts
true ? a : b
false ? a : b
x ? true : false
x ? false : true
js
a
b
x ? !0 : !1
x ? !1 : !0

Constant folding espressioni unarie

Modalità: --minify-syntax

Semplifica le operazioni unarie.

ts
+123
+"123"
-(-x)
~~x
!!x
js
123
123
123
123
x
~~x
!!x
x

Rimozione doppia negazione

Modalità: --minify-syntax

Rimuove le doppie negazioni non necessarie.

ts
!!x
!!!x
js
x
!x

Ottimizzazione statement if

Modalità: --minify-syntax

Ottimizza gli statement if con condizioni costanti.

ts
if (true) x;
if (false) x;
if (x) { a; }
if (x) {} else y;
js
x;
// rimosso
if(x)a;
if(!x)y;

Dead code elimination

Modalità: --minify-syntax

Rimuove il codice irraggiungibile e il codice senza side effects.

ts
if (false) {
  unreachable();
}
function foo() {
  return x;
  deadCode();
}
js
function foo(){return x}

Rimozione branch irraggiungibili

Modalità: --minify-syntax

Rimuove i branch che non possono mai essere eseguiti.

ts
while (false) {
  neverRuns();
}
js
// rimosso interamente

Rimozione blocchi vuoti

Modalità: --minify-syntax

Rimuove i blocchi vuoti e le parentesi non necessarie.

ts
{ }
if (x) { }
js
;
// rimosso

Unwrapping blocchi singolo statement

Modalità: --minify-syntax

Rimuove le parentesi non necessarie attorno a singoli statement.

ts
if (condition) {
  doSomething();
}
js
if(condition)doSomething();

Inlining enum TypeScript

Modalità: --minify-syntax

Inlines i valori enum TypeScript a compile time.

ts
enum Color { Red, Green, Blue }
const x = Color.Red;
js
const x=0;

Supporto annotazioni pure

Modalità: Sempre attivo

Rispetta le annotazioni /*@__PURE__*/ per il tree shaking.

ts
const x = /*@__PURE__*/ expensive();
// Se x è inutilizzato...
js
// rimosso interamente

Rinomina identificatori

Modalità: --minify-identifiers

Rinomina le variabili locali a nomi più corti basati sulla frequenza d'uso.

ts
function calculateSum(firstNumber, secondNumber) {
  const result = firstNumber + secondNumber;
  return result;
}
js
function a(b,c){const d=b+c;return d}

Strategia di naming:

  • Gli identificatori più frequentemente usati ottengono i nomi più corti (a, b, c...)
  • Lettere singole: a-z (26 nomi)
  • Lettere doppie: aa-zz (676 nomi)
  • Lettere triple e oltre secondo necessità

Identificatori preservati:

  • Parole chiave e riservate JavaScript
  • Identificatori globali
  • Export nominati (per mantenere l'API)
  • Nomi CommonJS: exports, module

Rimozione whitespace

Modalità: --minify-whitespace

Rimuove tutti i whitespace non necessari.

ts
function add(a, b) {
    return a + b;
}
let x = 10;
js
function add(a,b){return a+b;}let x=10;

Ottimizzazione punto e virgola

Modalità: --minify-whitespace

Inserisce punti e virgola solo quando necessario.

ts
let a = 1;
let b = 2;
return a + b;
js
let a=1;let b=2;return a+b

Rimozione spazi operatori

Modalità: --minify-whitespace

Rimuove gli spazi attorno agli operatori.

ts
a + b
x = y * z
foo && bar || baz
js
a+b
x=y*z
foo&&bar||baz

Rimozione commenti

Modalità: --minify-whitespace

Rimuove i commenti eccetto importanti commenti di license.

ts
// Questo commento è rimosso
/* Anche questo */
/*! Ma questo commento di license è mantenuto */
function test() { /* commento inline */ }
js
/*! Ma questo commento di license è mantenuto */
function test(){}

Formattazione oggetti e array

Modalità: --minify-whitespace

Rimuove il whitespace in oggetti e array literal.

ts
const obj = {
    name: "John",
    age: 30
};
const arr = [1, 2, 3];
js
const obj={name:"John",age:30};const arr=[1,2,3];

Formattazione control flow

Modalità: --minify-whitespace

Rimuove il whitespace nelle strutture di controllo.

ts
if (condition) {
    doSomething();
}
for (let i = 0; i < 10; i++) {
    console.log(i);
}
js
if(condition)doSomething();for(let i=0;i<10;i++)console.log(i);

Formattazione funzioni

Modalità: --minify-whitespace

Rimuove il whitespace nelle dichiarazioni di funzione.

ts
function myFunction(param1, param2) {
    return param1 + param2;
}
const arrow = (a, b) => a + b;
js
function myFunction(a,b){return a+b}const arrow=(a,b)=>a+b;

Minimizzazione parentesi

Modalità: Sempre attivo

Aggiunge parentesi solo quando necessario per la precedenza degli operatori.

ts
(a + b) * c
a + (b * c)
((x))
js
(a+b)*c
a+b*c
x

Property mangling

Modalità: --minify-identifiers (con configurazione)

Rinomina le proprietà degli oggetti a nomi più corti quando configurato.

ts
obj.longPropertyName
js
obj.a

Constant folding valori template literal

Modalità: --minify-syntax

Converte i valori interpolati non-stringa in stringhe e li folda nel template.

ts
`hello ${123}`
`value: ${true}`
`result: ${null}`
`status: ${undefined}`
`big: ${10n}`
js
"hello 123"
"value: true"
"result: null"
"status: undefined"
"big: 10"

Constant folding lunghezza stringa

Modalità: --minify-syntax

Valuta la proprietà .length sui letterali di stringa a compile time.

ts
"hello world".length
"test".length
js
11
4

Semplificazione chiamate costruttore

Modalità: --minify-syntax

Semplifica le chiamate costruttore per i tipi built-in.

ts
new Object()
new Object(null)
new Object({a: 1})
new Array()
new Array(x, y)
js
{}
{}
{a:1}
[]
[x,y]

Inlining oggetti singola proprietà

Modalità: --minify-syntax

Inlines l'accesso alle proprietà per oggetti con una singola proprietà.

ts
({fn: () => console.log('hi')}).fn()
js
(() => console.log('hi'))()

Constant folding string charCodeAt

Modalità: Sempre attivo

Valuta charCodeAt() sui letterali di stringa per caratteri ASCII.

ts
"hello".charCodeAt(1)
"A".charCodeAt(0)
js
101
65

Uguaglianza Void 0 a uguaglianza null

Modalità: --minify-syntax

Converte i controlli di uguaglianza loose con void 0 a null poiché sono equivalenti.

ts
x == void 0
x != void 0
js
x == null
x != null

Ottimizzazione operatore negazione

Modalità: --minify-syntax

Sposta l'operatore di negazione attraverso le espressioni comma.

ts
-(a, b)
-(x, y, z)
js
a,-b
x,y,-z

Inlining proprietà Import.meta

Modalità: Modalità bundle

Inlines le proprietà import.meta a build time quando i valori sono conosciuti.

ts
import.meta.dir
import.meta.file
import.meta.path
import.meta.url
js
"/percorso/alla/directory"
"filename.js"
"/percorso/completo/al/file.js"
"file:///percorso/completo/al/file.js"

Unione dichiarazioni variabili

Modalità: --minify-syntax

Unisce dichiarazioni di variabili adiacenti dello stesso tipo.

ts
let a = 1;
let b = 2;
const c = 3;
const d = 4;
js
let a=1,b=2;
const c=3,d=4;

Unione statement espressione

Modalità: --minify-syntax

Unisce statement di espressione adiacenti usando l'operatore comma.

ts
console.log(1);
console.log(2);
console.log(3);
js
console.log(1),console.log(2),console.log(3);

Unione statement return

Modalità: --minify-syntax

Unisce espressioni prima del return con l'operatore comma.

ts
console.log(x);
return y;
js
return console.log(x),y;

Unione statement throw

Modalità: --minify-syntax

Unisce espressioni prima del throw con l'operatore comma.

ts
console.log(x);
throw new Error();
js
throw(console.log(x),new Error());

Inlining enum cross-module TypeScript

Modalità: --minify-syntax (modalità bundle)

Inlines i valori enum attraverso i confini dei moduli.

ts
// lib.ts
export enum Color { Red, Green, Blue }

// Input (main.ts)
import { Color } from './lib';
const x = Color.Red;
js
const x=0;

Inlining enum proprietà computata

Modalità: --minify-syntax

Inlines i valori enum usati come proprietà di oggetti computate.

ts
enum Keys { FOO = 'foo' }
const obj = { [Keys.FOO]: value }
js
const obj={foo:value}

Numero stringa a indice numerico

Modalità: --minify-syntax

Converte l'accesso alle proprietà numeriche stringa in indice numerico.

ts
obj["0"]
arr["5"]
js
obj[0]
arr[5]

Accorciamento corpo arrow function

Modalità: Sempre attivo

Usa la sintassi expression body quando una arrow function restituisce solo un valore.

ts
() => { return x; }
(a) => { return a + 1; }
js
() => x
a => a + 1

Shorthand proprietà oggetto

Modalità: Sempre attivo

Usa la sintassi shorthand quando il nome della proprietà e l'identificatore del valore corrispondono.

ts
{ x: x, y: y }
{ name: name, age: age }
js
{ x, y }
{ name, age }

Shorthand metodo

Modalità: Sempre attivo

Usa la sintassi shorthand del metodo negli oggetti literal.

ts
{
  foo: function() {},
  bar: async function() {}
}
js
{
  foo() {},
  async bar() {}
}

Drop statement debugger

Modalità: --drop=debugger

Rimuove gli statement debugger dal codice.

ts
function test() {
  debugger;
  return x;
}
js
function test(){return x}

Drop chiamate console

Modalità: --drop=console

Rimuove tutte le chiamate ai metodi console.* dal codice.

ts
console.log("debug");
console.warn("warning");
x = console.error("error");
js
void 0;
void 0;
x=void 0;

Drop chiamate funzione custom

Modalità: --drop=<name>

Rimuove le chiamate a funzioni o metodi globali specificati.

ts
assert(condition);
obj.assert(test);
js
void 0;
void 0;

Keep Names

Quando minifichi gli identificatori, potresti voler preservare i nomi originali di funzioni e classi per scopi di debugging. Usa il flag --keep-names:

bash
bun build ./index.ts --minify --keep-names --outfile=out.js

O nell'API JavaScript:

ts
await Bun.build({
  entrypoints: ["./index.ts"],
  outdir: "./out",
  minify: {
    identifiers: true,
    keepNames: true,
  },
});

Questo preserva la proprietà .name su funzioni e classi mentre minifica ancora i nomi effettivi degli identificatori nel codice.

Esempio Combinato

Usando tutte e tre le modalità di minificazione insieme:

ts
const myVariable = 42;

const myFunction = () => {
  const isValid = true;
  const result = undefined;
  return isValid ? myVariable : result;
};

const output = myFunction();
js
// Output con --minify (49 byte, 69% riduzione)
const a=42,b=()=>{const c=!0,d=void 0;return c?a:d},e=b();

Quando Usare la Minificazione

Usa --minify per:

  • Bundle production
  • Ridurre i costi di banda CDN
  • Migliorare i tempi di caricamento pagina

Usa modalità individuali per:

  • --minify-whitespace: Riduzione rapida delle dimensioni senza cambiamenti semantici
  • --minify-syntax: Output più piccolo mantenendo identificatori leggibili per il debugging
  • --minify-identifiers: Massima riduzione delle dimensioni (combina con --keep-names per migliori stack trace)

Evita la minificazione per:

  • Build di sviluppo (più difficile da debuggare)
  • Quando hai bisogno di messaggi di errore leggibili
  • Librerie dove i consumatori potrebbero leggere il sorgente

Bun a cura di www.bunjs.com.cn