JavaScript 포맷터 & 압축기
JavaScript 정리 또는 실제 압축·이름 축약으로 최소화
로컬 실행
loading…
이 도구에 대해
일관된 들여쓰기와 간격으로 JavaScript를 정리하세요 — 벤더링된 번들을 펼쳐 실제로 무엇을 하는지 읽거나, 콘솔에서 붙여넣은 코드를 다듬는 데 좋습니다. 압축기는 진짜입니다. Terser가 코드를 AST로 파싱해 죽은 코드를 버리고 지역 변수 이름을 줄이고 주석을 제거하는데, 번들러들이 프로덕션에서 쓰는 바로 그 엔진입니다.
압축이 AST 기반이라, 정규식 기반 "압축기"들이 하듯 동작하는 코드를 망가뜨리는 일이 없습니다. 문자열, 템플릿 리터럴, 정규식, ASI 엣지 케이스가 실제 파서로 처리됩니다. 문법 오류는 손상된 출력을 내놓는 대신 위치와 함께 보고됩니다.
Terser는 처음 압축할 때에만 로드되어 페이지를 가볍게 유지하며, 전부 브라우저 안에서 실행됩니다 — 사내 소스 코드는 기기를 벗어나지 않습니다.
자주 묻는 질문
- 코드가 얼마나 작아지나요?
- 손으로 쓴 코드는 gzip 전 기준 보통 30–60% 줄어듭니다. 공백, 주석, 긴 지역 변수 이름이 그만큼의 무게를 차지합니다. 이미 번들된 코드는 훨씬 덜 줄어듭니다 — 같은 변환을 이미 한 번 거쳤으니까요.
- 압축이 동작을 바꾸나요?
- 압축과 이름 축약(mangling)은 의미를 보존합니다. 지역 이름만 바뀌고, 죽은 코드 제거는 실행될 수 없음이 증명되는 분기만 없앱니다. 자기 함수의 Function.prototype.name이나 toString()에 의존하는 코드가 고전적인 예외입니다.
- 웹사이트의 프로덕션 코드를 다시 펼칠(un-minify) 수 있나요?
- 포매터가 공백과 구조를 복원해 제어 흐름은 읽을 수 있게 되지만, 원래 변수 이름과 주석은 영원히 사라졌습니다. a, b, c만 보게 될 겁니다. 본격적인 디버깅이라면 사이트가 소스 맵을 제공하는 경우 그쪽을 쓰는 편이 낫습니다.
- TypeScript나 JSX를 지원하나요?
- 아니요 — 둘 다 전용 파서가 필요합니다. 먼저 JavaScript로 컴파일한 뒤(tsc, esbuild) 그 출력을 여기서 포맷하거나 압축하세요.