자바스크립트 압축기

공백, 주석, 줄바꿈을 지워 자바스크립트를 압축하고 파일 크기를 줄여 사이트를 빠르게 만드세요. 압축 전후 글자 수를 보여 주는 무료 JS minifier.

더 가벼운 자바스크립트로 더 빠른 페이지

자바스크립트는 웹페이지에서 가장 비용이 큰 리소스인 경우가 많습니다. 내려받고, 해석하고, 실행해야 하며, 탭과 클릭에 페이지가 반응하는 속도를 늦출 수 있습니다. 압축하면 주석, 공백, 줄바꿈이 사라져 파일이 작아지고, 도구가 압축 전 JS 글자 수와 압축 후 압축된 JS 글자 수를 보여 줍니다.

작은 프로젝트의 스크립트, CMS에 넣는 코드 조각, 추적·위젯 코드 등 번들러가 자동으로 압축해 주지 않는 곳이라면 어디든 쓸 수 있습니다.

코드의 동작은 그대로입니다. 편집과 디버깅용 원본은 보관하세요.

자바스크립트 압축기 사용법

  1. 자바스크립트 코드를 붙여 넣습니다.
  2. 제출 버튼을 눌러 압축합니다.
  3. 글자 수를 비교합니다.
  4. 압축된 스크립트를 복사하고 페이지를 테스트합니다.

예시

작은 함수

입력:

// Greet the user
function greet(name) {
  const message = 'Hello, ' + name + '!';
  console.log(message);
  return message;
}

greet('Zach');

결과:

function greet(name){const message="Hello, "+name+"!";console.log(message);return message}greet("Zach")

주석, 줄바꿈, 공백이 지워지고, 작은따옴표는 큰따옴표가 되며, 각 블록의 마지막 세미콜론이 빠집니다. 변수 이름은 그대로입니다. 이 도구는 공백은 줄이지만 이름을 바꾸지는 않습니다.

주요 활용 사례

  • 워드프레스, 쇼피파이 등 CMS 푸터에 넣는 사용자 정의 스크립트 압축하기.
  • 배포하는 작은 라이브러리와 위젯 줄이기.
  • 북마클릿과 인라인 스크립트 준비하기.
  • 빌드 도구가 없는 간단한 사이트의 운영용 파일 빠르게 만들기.

알아두면 좋은 팁

  • 모든 문장이 제대로 끝나는지(필요한 곳에 세미콜론) 확인하세요. 줄바꿈에 의존하는 코드는 줄바꿈이 사라지면 깨질 수 있습니다.
  • 압축은 보안 수단이 아닙니다. 누구나 압축된 코드를 다시 정리해 읽을 수 있습니다.
  • 스크립트가 렌더링을 막지 않도록 script 태그에 defer나 async를 쓰세요.
  • JSON 데이터는 JSON 검사기로 따로 검증하고, 스타일은 CSS 압축기로 압축하세요.

특수한 경우와 제한 사항

  • ( 나 [로 시작하는 줄처럼 자동 세미콜론 삽입에 의존하는 코드는 줄이 합쳐지면 깨질 수 있습니다. 압축하기 전에 세미콜론을 넣으세요.
  • /*! license */ 주석을 포함해 주석이 모두 지워지므로 필요한 고지는 다시 추가하세요.
  • 입력에 문법 오류가 있으면 결과가 잘못되거나 오류가 납니다. 압축하기 전에 코드를 테스트하세요.
  • 더 많이 줄이려면 변수 이름까지 짧게 바꾸는(mangling) 압축기가 있는 번들러(Terser, esbuild 등)를 쓰세요.

자주 묻는 질문

JS 압축(minification)이란 무엇인가요?

엔진에 필요 없는 공백과 주석 같은 문자를 자바스크립트에서 지워 파일을 작게 만드는 것입니다.

압축하면 자바스크립트가 깨질 수 있나요?

코드가 줄바꿈을 통한 자동 세미콜론 삽입에 의존한다면 그럴 수 있습니다. 배포하기 전에 압축한 버전을 테스트하세요.

압축과 난독화는 무엇이 다른가요?

압축은 코드를 작게 만들고, 난독화는 일부러 이해하기 어렵게 만듭니다. 둘 다 코드를 진정으로 보호하지는 못합니다.

번들러를 쓰는데도 이 도구가 필요한가요?

Vite, webpack, esbuild 같은 도구는 보통 운영 빌드에서 자동으로 압축합니다. 이 도구는 빠르게 한 번 처리할 작업에 쓰세요.

압축한 코드가 더 빨리 실행되나요?

크기가 작아 내려받기와 해석이 조금 빨라집니다. 코드 자체의 실행 속도는 같습니다.

관련 도구

유사한 도구

HTML 압축기

공백, 줄바꿈, 주석을 지워 HTML을 압축하고 페이지 용량을 줄여 로딩 속도를 높이세요. 압축 전후 글자 수도 보여 주는 무료 HTML minifier.

CSS 압축기

공백, 줄바꿈, 주석을 지워 CSS를 압축하고 스타일시트 용량을 줄여 페이지를 빠르게 만드세요. 압축 전후 크기를 보여 주는 무료 CSS minifier.

인기 무료 도구