Bun JS 축소기

Bun 은 코드베이스에 따라 80% 이상 번들 크기를 줄일 수 있는 빠른 JavaScript 및 TypeScript 축소기를 포함하며 출력 코드를 더 빠르게 실행되게 만듭니다. 축소기는 상수 폴딩, 데드 코드 제거 및 구문 변환을 포함한 수십 가지 최적화를 수행합니다. 다른 축소기와 달리 Bun 의 축소기는 인쇄할 코드가 적어 bun build 를 더 빠르게 실행되게 만듭니다.

CLI 사용법

모든 축소 활성화

--minify 플래그를 사용하여 모든 축소 모드를 활성화합니다:

bash

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

--minify 플래그는 다음을 자동으로 활성화합니다:

공백 축소
구문 축소
식별자 축소

프로덕션 모드

--production 플래그는 축소를 자동으로 활성화합니다:

bash

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

--production 플래그는 또한 다음을 수행합니다:

process.env.NODE_ENV 를 production 으로 설정
프로덕션 모드 JSX 가져오기 및 변환 활성화

세밀한 제어

특정 축소 모드를 개별적으로 활성화할 수 있습니다:

bash

# 공백만 제거
bun build ./index.ts --minify-whitespace --outfile=out.js

# 구문만 축소
bun build ./index.ts --minify-syntax --outfile=out.js

# 식별자만 축소
bun build ./index.ts --minify-identifiers --outfile=out.js

# 특정 모드 결합
bun build ./index.ts --minify-whitespace --minify-syntax --outfile=out.js

JavaScript API

Bun 의 번들러를 프로그래밍 방식으로 사용할 때 minify 옵션을 통해 축소를 구성합니다:

await Bun.build({
  entrypoints: ["./index.ts"],
  outdir: "./out",
  minify: true, // 모든 축소 모드 활성화
});

세밀한 제어를 위해 객체를 전달합니다:

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

축소 모드

Bun 의 축소기는 별도로 또는 결합하여 활성화할 수 있는 세 가지 독립 모드가 있습니다.

공백 축소 (`--minify-whitespace`)

출력에서 불필요한 공백, 줄바꿈 및 서식을 모두 제거합니다.

구문 축소 (`--minify-syntax`)

JavaScript 구문을 더 짧은 동등한 형태로 다시 작성하고 상수 폴딩, 데드 코드 제거 및 기타 최적화를 수행합니다.

식별자 축소 (`--minify-identifiers`)

빈도 기반 최적화를 사용하여 로컬 변수 및 함수 이름을 더 짧은 식별자로 이름 변경합니다.

모든 변환

불리언 리터럴 단축

모드: --minify-syntax

불리언 리터럴을 더 짧은 표현식으로 변환합니다.

true
false

!0
!1

불리언 대수 최적화

모드: --minify-syntax

논리 규칙을 사용하여 불리언 표현식을 단순화합니다.

!!x
x === true
x && true
x || false
!true
!false

x
x
x
x
!1
!0

undefined 단축

모드: --minify-syntax

undefined 를 더 짧은 동등한 표현으로 대체합니다.

undefined
let x = undefined;

void 0
let x=void 0;

undefined equality 최적화

모드: --minify-syntax

undefined 와의 느슨한 equality 검사를 최적화합니다.

x == undefined
x != undefined

x == null
x != null

Infinity 단축

모드: --minify-syntax

Infinity 를 수학적 표현식으로 변환합니다.

Infinity
-Infinity

1/0
-1/0

typeof 최적화

모드: --minify-syntax

typeof 비교를 최적화하고 상수 typeof 표현식을 평가합니다.

typeof x === 'undefined'
typeof x !== 'undefined'
typeof require
typeof null
typeof true
typeof 123
typeof "str"
typeof 123n

typeof x>'u'
typeof x<'u'
"function"
"object"
"boolean"
"number"
"string"
"bigint"

숫자 형식

모드: --minify-syntax

숫자를 가장 간결한 표현으로 형식화합니다.

1e4
1e5
1e6
1
-42

산술 상수 폴딩

모드: --minify-syntax

컴파일 타임에 산술 연산을 평가합니다.

비트 연산 상수 폴딩

모드: --minify-syntax

컴파일 타임에 비트 연산을 평가합니다.

5 & 3
5 | 3
5 ^ 3
8 << 2
32 >> 2
~5

문자열 연결

모드: --minify-syntax

컴파일 타임에 문자열 리터럴을 결합합니다.

"a" + "b"
"x" + 123
"foo" + "bar" + "baz"

"ab"
"x123"
"foobarbaz"

문자열 인덱싱

모드: --minify-syntax

컴파일 타임에 문자열 문자 액세스를 평가합니다.

"foo"[2]
"hello"[0]

"o"
"h"

템플릿 리터럴 폴딩

모드: --minify-syntax

상수 표현식이 있는 템플릿 리터럴을 평가합니다.

`a${123}b`
`result: ${5 + 10}`

"a123b"
"result: 15"

템플릿 리터럴을 문자열로 변환

모드: --minify-syntax

간단한 템플릿 리터럴을 일반 문자열로 변환합니다.

`Hello World`
`Line 1
Line 2`

"Hello World"
"Line 1\nLine 2"

문자열 따옴표 최적화

모드: --minify-syntax

이스케이프를 최소화하기 위해 최적의 따옴표 문자를 선택합니다.

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

"It's a string"
'He said "hello"'
"Simple string"

배열 스프레드 인라인

모드: --minify-syntax

상수 배열로 배열 스프레드 연산을 인라인합니다.

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

[1,2,3,4]
[a,b]

배열 인덱싱

모드: --minify-syntax

컴파일 타임에 상수 배열 액세스를 평가합니다.

[x][0]
['a', 'b', 'c'][1]
['a', , 'c'][1]

x
'b'
void 0

속성 액세스 최적화

모드: --minify-syntax

가능한 경우 괄호 표기법을 점 표기법으로 변환합니다.

obj["property"]
obj["validName"]
obj["123"]
obj["invalid-name"]

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

비교 폴딩

모드: --minify-syntax

컴파일 타임에 상수 비교를 평가합니다.

3 < 5
5 > 3
3 <= 3
5 >= 6
"a" < "b"

!0
!0
!0
!1
!0

논리 연산 폴딩

모드: --minify-syntax

상수 값으로 논리 연산을 단순화합니다.

true && x
false && x
true || x
false || x

x
!1
!0
x

Nullish coalescing 폴딩

모드: --minify-syntax

알려진 값으로 nullish coalescing 을 평가합니다.

null ?? x
undefined ?? x
42 ?? x

x
x
42

쉼표 표현식 단순화

모드: --minify-syntax

쉼표 시퀀스에서 사이드 이펙트가 없는 표현식을 제거합니다.

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

x
x

3 항 조건문 폴딩

모드: --minify-syntax

상수 조건으로 조건부 표현식을 평가합니다.

true ? a : b
false ? a : b
x ? true : false
x ? false : true

a
b
x ? !0 : !1
x ? !1 : !0

단항 표현식 폴딩

모드: --minify-syntax

단항 연산을 단순화합니다.

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

123
123
123
123
x
~~x
!!x
x

이중 부정 제거

모드: --minify-syntax

불필요한 이중 부정을 제거합니다.

!!x
!!!x

x
!x

if 문 최적화

모드: --minify-syntax

상수 조건으로 if 문을 최적화합니다.

if (true) x;
if (false) x;
if (x) { a; }
if (x) {} else y;

x;
// 제거됨
if(x)a;
if(!x)y;

데드 코드 제거

모드: --minify-syntax

도달할 수 없는 코드와 사이드 이펙트가 없는 코드를 제거합니다.

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

function foo(){return x}

도달할 수 없는 분기 제거

모드: --minify-syntax

실행될 수 없는 분기를 제거합니다.

while (false) {
  neverRuns();
}

// 완전히 제거됨

빈 블록 제거

모드: --minify-syntax

빈 블록과 불필요한 중괄호를 제거합니다.

{ }
if (x) { }

;
// 제거됨

단일 문 블록 랩핑 해제

모드: --minify-syntax

단일 문 주변의 불필요한 중괄호를 제거합니다.

if (condition) {
  doSomething();
}

if(condition)doSomething();

TypeScript enum 인라인

모드: --minify-syntax

컴파일 타임에 TypeScript enum 값을 인라인합니다.

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

const x=0;

Pure 주석 지원

모드: 항상 활성화

트리 쉐이킹을 위해 /*@__PURE__*/ 주석을 존중합니다.

const x = /*@__PURE__*/ expensive();
// x 가 사용되지 않으면...

// 완전히 제거됨

식별자 이름 변경

모드: --minify-identifiers

사용 빈도에 따라 로컬 변수를 더 짧은 이름으로 이름 변경합니다.

function calculateSum(firstNumber, secondNumber) {
  const result = firstNumber + secondNumber;
  return result;
}

function a(b,c){const d=b+c;return d}

명명 전략:

가장 자주 사용되는 식별자는 가장 짧은 이름을 얻습니다 (a, b, c...)
단일 문자: a-z (26 개 이름)
이중 문자: aa-zz (676 개 이름)
삼중 문자 이상은 필요에 따라

보존된 식별자:

JavaScript 키워드 및 예약어
전역 식별자
명명된 내보내기 (API 유지를 위해)
CommonJS 이름: exports, module

공백 제거

모드: --minify-whitespace

모든 불필요한 공백을 제거합니다.

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

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

세미콜론 최적화

모드: --minify-whitespace

필요한 경우에만 세미콜론을 삽입합니다.

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

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

연산자 간격 제거

모드: --minify-whitespace

연산자 주변의 공백을 제거합니다.

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

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

주석 제거

모드: --minify-whitespace

중요한 라이선스 주석을 제외하고 주석을 제거합니다.

// 이 주석은 제거됨
/* 이것도 */
/*! 하지만 이 라이선스 주석은 유지됨 */
function test() { /* 인라인 주석 */ }

/*! 하지만 이 라이선스 주석은 유지됨 */
function test(){}

객체 및 배열 형식

모드: --minify-whitespace

객체 및 배열 리터럴에서 공백을 제거합니다.

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

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

제어 흐름 형식

모드: --minify-whitespace

제어 구조에서 공백을 제거합니다.

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

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

함수 형식

모드: --minify-whitespace

함수 선언에서 공백을 제거합니다.

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

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

괄호 최소화

모드: 항상 활성화

연산자 우선순위에 필요한 경우에만 괄호를 추가합니다.

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

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

속성 맹글링

모드: --minify-identifiers (구성 포함)

구성된 경우 객체 속성을 더 짧은 이름으로 이름 변경합니다.

obj.longPropertyName

obj.a

템플릿 리터럴 값 폴딩

모드: --minify-syntax

비문자열 보간 값을 문자열로 변환하고 템플릿에 폴딩합니다.

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

"hello 123"
"value: true"
"result: null"
"status: undefined"
"big: 10"

문자열 길이 상수 폴딩

모드: --minify-syntax

컴파일 타임에 문자열 리터럴의 .length 속성을 평가합니다.

"hello world".length
"test".length

11
4

생성자 호출 단순화

모드: --minify-syntax

내장 타입에 대한 생성자 호출을 단순화합니다.

new Object()
new Object(null)
new Object({a: 1})
new Array()
new Array(x, y)

{}
{}
{a:1}
[]
[x,y]

단일 속성 객체 인라인

모드: --minify-syntax

단일 속성이 있는 객체에 대한 속성 액세스를 인라인합니다.

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

(() => console.log('hi'))()

문자열 charCodeAt 상수 폴딩

모드: 항상 활성화

ASCII 문자에 대한 문자열 리터럴의 charCodeAt() 을 평가합니다.

"hello".charCodeAt(1)
"A".charCodeAt(0)

101
65

void 0 equality 를 null equality 로

모드: --minify-syntax

동등하므로 void 0 와의 느슨한 equality 검사를 null 로 변환합니다.

x == void 0
x != void 0

x == null
x != null

부정 연산자 최적화

모드: --minify-syntax

쉼표 표현식을 통해 부정 연산자를 이동합니다.

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

a,-b
x,y,-z

import.meta 속성 인라인

모드: 번들 모드

값이 알려져 있을 때 빌드 타임에 import.meta 속성을 인라인합니다.

import.meta.dir
import.meta.file
import.meta.path
import.meta.url

"/path/to/directory"
"filename.js"
"/full/path/to/file.js"
"file:///full/path/to/file.js"

변수 선언 병합

모드: --minify-syntax

동일한 타입의 인접한 변수 선언을 병합합니다.

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

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

표현식 문 병합

모드: --minify-syntax

쉼표 연산자를 사용하여 인접한 표현식 문을 병합합니다.

console.log(1);
console.log(2);
console.log(3);

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

return 문 병합

모드: --minify-syntax

쉼표 연산자로 return 전에 표현식을 병합합니다.

console.log(x);
return y;

return console.log(x),y;

throw 문 병합

모드: --minify-syntax

쉼표 연산자로 throw 전에 표현식을 병합합니다.

console.log(x);
throw new Error();

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

TypeScript enum 교차 모듈 인라인

모드: --minify-syntax (번들 모드)

모듈 경계를 넘어 enum 값을 인라인합니다.

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

// 입력 (main.ts)
import { Color } from './lib';
const x = Color.Red;

const x=0;

계산된 속성 enum 인라인

모드: --minify-syntax

계산된 객체 속성으로 사용되는 enum 값을 인라인합니다.

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

const obj={foo:value}

문자열 숫자를 숫자 인덱스로

모드: --minify-syntax

문자열 숫자 속성 액세스를 숫자 인덱스로 변환합니다.

obj["0"]
arr["5"]

obj[0]
arr[5]

애로우 함수 본문 단축

모드: 항상 활성화

애로우 함수가 값만 반환할 때 표현식 본문 구문을 사용합니다.

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

() => x
a => a + 1

객체 속성 단축

모드: 항상 활성화

속성 이름과 값 식별자가 일치할 때 단축 구문을 사용합니다.

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

{ x, y }
{ name, age }

메서드 단축

모드: 항상 활성화

객체 리터럴에서 메서드 단축 구문을 사용합니다.

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

{
  foo() {},
  async bar() {}
}

debugger 문 제거

모드: --drop=debugger

코드에서 debugger 문을 제거합니다.

function test() {
  debugger;
  return x;
}

function test(){return x}

console 호출 제거

모드: --drop=console

코드에서 모든 console.* 메서드 호출을 제거합니다.

console.log("debug");
console.warn("warning");
x = console.error("error");

void 0;
void 0;
x=void 0;

커스텀 함수 호출 제거

모드: --drop=<name>

지정된 전역 함수 또는 메서드 호출을 제거합니다.

assert(condition);
obj.assert(test);

void 0;
void 0;

이름 유지

식별자를 축소할 때 디버깅 목적으로 원래 함수 및 클래스 이름을 유지할 수 있습니다. --keep-names 플래그를 사용하세요:

bash

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

또는 JavaScript API 에서:

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

이는 코드의 실제 식별자 이름을 여전히 축소하는 동안 함수 및 클래스의 .name 속성을 유지합니다.

결합 예제

세 가지 축소 모드를 모두 함께 사용:

const myVariable = 42;

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

const output = myFunction();

// 출력 --minify 사용 (49 바이트, 69% 감소)
const a=42,b=()=>{const c=!0,d=void 0;return c?a:d},e=b();

축소 사용 시기

--minify 사용:

프로덕션 번들
CDN 대역폭 비용 절감
페이지 로드 시간 개선

개별 모드 사용:

--minify-whitespace: 의미론적 변경 없이 빠른 크기 축소
--minify-syntax: 디버깅을 위해 읽을 수 있는 식별자를 유지하면서 더 작은 출력
--minify-identifiers: 최대 크기 축소 (더 나은 스택 트레이스를 위해 --keep-names 와 결합)

축소 피하기:

개발 빌드 (디버깅 어려움)
읽을 수 있는 오류 메시지가 필요한 경우
소비자가 소스를 읽을 수 있는 라이브러리

CLI 사용법 ​

모든 축소 활성화 ​

프로덕션 모드 ​

세밀한 제어 ​

JavaScript API ​

축소 모드 ​

공백 축소 (--minify-whitespace) ​

구문 축소 (--minify-syntax) ​

식별자 축소 (--minify-identifiers) ​

모든 변환 ​

불리언 리터럴 단축 ​

불리언 대수 최적화 ​

undefined 단축 ​

undefined equality 최적화 ​

Infinity 단축 ​

typeof 최적화 ​

숫자 형식 ​

산술 상수 폴딩 ​

비트 연산 상수 폴딩 ​

문자열 연결 ​

문자열 인덱싱 ​

템플릿 리터럴 폴딩 ​

템플릿 리터럴을 문자열로 변환 ​

문자열 따옴표 최적화 ​

배열 스프레드 인라인 ​

배열 인덱싱 ​

속성 액세스 최적화 ​

비교 폴딩 ​

논리 연산 폴딩 ​

Nullish coalescing 폴딩 ​

쉼표 표현식 단순화 ​

3 항 조건문 폴딩 ​

단항 표현식 폴딩 ​

이중 부정 제거 ​

if 문 최적화 ​

데드 코드 제거 ​

도달할 수 없는 분기 제거 ​

빈 블록 제거 ​

단일 문 블록 랩핑 해제 ​

TypeScript enum 인라인 ​

Pure 주석 지원 ​

식별자 이름 변경 ​

공백 제거 ​

세미콜론 최적화 ​

연산자 간격 제거 ​

주석 제거 ​

객체 및 배열 형식 ​

제어 흐름 형식 ​

함수 형식 ​

괄호 최소화 ​

속성 맹글링 ​

템플릿 리터럴 값 폴딩 ​

문자열 길이 상수 폴딩 ​

생성자 호출 단순화 ​

단일 속성 객체 인라인 ​

문자열 charCodeAt 상수 폴딩 ​

void 0 equality 를 null equality 로 ​

부정 연산자 최적화 ​

import.meta 속성 인라인 ​

변수 선언 병합 ​

표현식 문 병합 ​

return 문 병합 ​

throw 문 병합 ​

TypeScript enum 교차 모듈 인라인 ​

계산된 속성 enum 인라인 ​

문자열 숫자를 숫자 인덱스로 ​

애로우 함수 본문 단축 ​

객체 속성 단축 ​

메서드 단축 ​

debugger 문 제거 ​

console 호출 제거 ​

커스텀 함수 호출 제거 ​

이름 유지 ​

결합 예제 ​

축소 사용 시기 ​

CLI 사용법

모든 축소 활성화

프로덕션 모드

세밀한 제어

JavaScript API

축소 모드

공백 축소 (`--minify-whitespace`)

구문 축소 (`--minify-syntax`)

식별자 축소 (`--minify-identifiers`)

모든 변환

불리언 리터럴 단축

불리언 대수 최적화

undefined 단축

undefined equality 최적화

Infinity 단축

typeof 최적화

숫자 형식

산술 상수 폴딩

비트 연산 상수 폴딩

문자열 연결

문자열 인덱싱

템플릿 리터럴 폴딩

템플릿 리터럴을 문자열로 변환

문자열 따옴표 최적화

배열 스프레드 인라인

배열 인덱싱

속성 액세스 최적화

비교 폴딩

논리 연산 폴딩

Nullish coalescing 폴딩

쉼표 표현식 단순화

3 항 조건문 폴딩

단항 표현식 폴딩

이중 부정 제거

if 문 최적화

데드 코드 제거

도달할 수 없는 분기 제거

빈 블록 제거

단일 문 블록 랩핑 해제

TypeScript enum 인라인

Pure 주석 지원

식별자 이름 변경

공백 제거

세미콜론 최적화

연산자 간격 제거

주석 제거

객체 및 배열 형식

제어 흐름 형식

함수 형식

괄호 최소화

속성 맹글링

템플릿 리터럴 값 폴딩

문자열 길이 상수 폴딩

생성자 호출 단순화

단일 속성 객체 인라인

문자열 charCodeAt 상수 폴딩

void 0 equality 를 null equality 로

부정 연산자 최적화

import.meta 속성 인라인

변수 선언 병합

표현식 문 병합

return 문 병합

throw 문 병합

TypeScript enum 교차 모듈 인라인

계산된 속성 enum 인라인

문자열 숫자를 숫자 인덱스로

애로우 함수 본문 단축

객체 속성 단축

메서드 단축

debugger 문 제거

console 호출 제거

커스텀 함수 호출 제거

이름 유지

결합 예제

축소 사용 시기