개발
JS 미니파이어·포매터
자바스크립트 코드를 압축(minify)하거나 보기 좋게 정렬(beautify)합니다. 정규식·템플릿 리터럴·ASI를 인식해 따옴표·코드 의미는 그대로 보존합니다.
입력
출력
사용 방법
- 왼쪽 입력창에 자바스크립트 코드를 붙여넣습니다.
- 상단에서 Minify(압축) 또는 Beautify(정렬) 모드를 선택합니다.
- Minify 모드는 주석·공백을 모두 제거하며, /*! 라이선스 주석 보존 옵션과 문장 사이 줄바꿈 유지 옵션을 따로 켤 수 있습니다.
- Beautify 모드는 들여쓰기 단위(탭/2칸/4칸)를 선택해 다시 보기 좋게 정렬합니다.
- 우측 상단에 표시되는 크기 변화·압축률을 확인하고 결과를 복사합니다.
JS 미니파이어·포매터 자세히 알아보기
JS 미니파이어는 webpack·rollup·esbuild 같은 번들러를 거치지 않는 자바스크립트 파일을 빠르게 줄여주는 도구입니다. 워드프레스 테마의 인라인 스크립트, GTM·GA 태그 매니저에 들어가는 커스텀 스크립트, 정적 사이트의 단일 .js 파일, 코드 데모용 스니펫처럼 빌드 단계가 없는 자바스크립트를 그대로 압축할 때 사용합니다. 일반적인 코드는 주석과 공백 제거만으로도 30~55% 크기 절감을 기대할 수 있습니다. 본 도구는 토큰 기반 파서로 작동합니다. 문자열·템플릿 리터럴(`백틱`)·정규식 리터럴을 모두 인식해 그 안의 공백은 절대 건드리지 않으며, return / throw / break / continue / yield 뒤의 줄바꿈처럼 ASI(자동 세미콜론 삽입)에 영향을 주는 구간에는 자동으로 세미콜론을 삽입해 의미를 보존합니다. 식별자명을 짧게 줄이는 manglinng·dead-code 제거는 하지 않으므로 결과 코드는 디버깅 가능한 상태를 유지합니다 — 더 강한 압축이 필요하다면 빌드 단계에서 terser를 사용하세요.
이럴 때 사용하세요
- •워드프레스 테마·플러그인의 인라인 <script> 블록 압축
- •GTM·GA 태그 매니저에 붙여넣을 커스텀 자바스크립트 한 줄로 정리
- •빌드 도구가 없는 정적 페이지의 단일 .js 파일 수동 미니파이
- •공유받은 한 줄 압축 JS를 디버깅하기 위해 다시 들여쓰기로 풀기
- •이메일·SMS 같이 글자수가 빡빡한 채널에 들어갈 짧은 스크립트 정리
JS 미니파이어·포매터 자주 묻는 질문
정규식이나 템플릿 리터럴 안의 공백도 건드리나요?
아니요. 본 도구는 식별자·숫자·연산자 외에 문자열("..."·'...'), 템플릿 리터럴(`...`), 정규식 리터럴(/.../)을 별도 토큰으로 인식해 그 내부 문자는 절대 변경하지 않습니다. 정규식 안의 공백·이스케이프, 템플릿 리터럴의 ${'$'}{'{...}'} 표현식 모두 그대로 보존됩니다.
return 다음에 줄바꿈이 있는 코드도 안전한가요?
네. return·throw·break·continue·yield 같은 ASI 제약 키워드 뒤에 줄바꿈이 있고 다음 줄에 값이 이어지는 경우, 압축 시 자동으로 세미콜론을 삽입해 원래 의미를 유지합니다. "문장 사이 줄바꿈 유지" 옵션을 켜면 줄바꿈을 그대로 두는 더 보수적인 모드로 전환할 수 있습니다.
다른 minifier (terser·esbuild)와 무엇이 다른가요?
terser·esbuild는 변수명 단축(mangling), 죽은 코드 제거, 함수 인라인 같은 적극적인 최적화를 수행하지만 이 도구는 주석·공백 제거 + 토큰 사이 안전한 결합만 합니다. 결과 코드는 식별자명이 그대로라 압축률은 더 낮지만 디버깅·검증이 쉽고, 빌드 도구를 설치하지 않고도 즉시 사용할 수 있다는 장점이 있습니다.
JSX·TypeScript도 처리되나요?
본 도구는 표준 ES2022 자바스크립트를 대상으로 합니다. JSX 태그(`<div>...</div>`)나 TypeScript 타입 어노테이션(`: string`)은 일부 토큰화에서 어색한 결과를 낼 수 있으니, 컴파일된 .js 파일을 입력해 주세요.
압축한 코드를 다시 보기 좋게 풀 수 있나요?
네. 한 줄짜리 압축 JS를 그대로 입력창에 붙여넣고 Beautify 모드를 누르면 중괄호·세미콜론을 기준으로 다시 줄바꿈해서 보여줍니다. 다만 원본의 변수명 의도나 주석은 복원되지 않으니 디버깅·구조 파악 용도로 활용해 주세요.