Nouplo

JavaScript 압축

더 작게, 그러면서 확실히 같은 코드.

예제는 입력과 설정을 일시적으로 바꿉니다. 이전 작업을 복원할 수 있습니다.

0자
출력
위에 붙여넣거나 입력하면 여기에 결과가 표시됩니다.

파일은 내 기기 밖으로 나가지 않습니다

이 도구는 브라우저 안에서만 작동합니다. 붙여넣은 내용은 기기에서 처리되고 서버로 전송되지 않으므로 토큰, 키, 공개 전 문서도 안심하고 사용할 수 있습니다.

사용 예시

예: 꽃집 주문서 스크립트 압축, 605자에서 416자로

하늘빛 꽃집 주문서는 휴대폰 번호를 010-1234-5678 꼴로 맞추고, 꽃값이 5만 원 이상이면 배송비를 빼고 합계를 원 단위로 보여 줍니다. 한글 주석 4개를 포함해 19줄, 605자. 설정은 「압축」.

  1. 위 숫자는 변환 전 605, 변환 후 416, 절감 31%. 19줄이 4줄이 되고 한글 주석 4개는 모두 사라집니다.
  2. return digits.length === 10 다음 줄이 ? 로 시작하는 곳은 줄바꿈이 남습니다. 지워도 안전하다고 증명할 수 없는 줄바꿈은 건드리지 않기 때문입니다.
  3. '원 (배송비 ' 같은 한글 문자열과 '$1-$2-$3' 은 그대로이고, 정규식 /(\d{3})(\d{4})(\d{4})/ 도 한 글자도 바뀌지 않습니다.
  4. 숫자는 글자 수입니다. UTF-8 바이트로는 721바이트 → 430바이트로, 한 글자 3바이트인 한글 주석이 빠진 만큼 약 40% 줄어듭니다.
  5. 압축 전후 결과가 같습니다. '010 1234 5678' → 010-1234-5678, '0161234567' → 016-123-4567, 꽃값 45,000원 → 48,000원 (배송비 3,000원 포함).
부분 변환 전 변환 후
숫자만 남기기 const digits = input.replace(/\D/g, '');const digits=input.replace(/\D/g,'');
배송비 const fee = flowers >= 50000 ? 0 : delivery;const fee=flowers>=50000?0:delivery;
삼항 연산자 return digits.length === 10 (줄바꿈) ? digits.replace(…)return digits.length===10 (줄바꿈) ?digits.replace(…)
파일 전체 19줄, 605자 (721바이트)4줄, 416자 (430바이트)

함수 이름 formatPhone, orderTotal 은 그대로라 주문서 HTML은 고칠 필요가 없습니다. 416자짜리 파일로 바꿔 올리면 됩니다.

사용 방법

  1. JavaScript를 붙여넣습니다.
  2. 주석과 들여쓰기가 사라집니다. 이름은 그대로입니다.
  3. 위에 나오는 숫자로 얼마나 줄었는지 확인합니다.
  4. 결과를 복사하거나 내려받습니다.

자주 묻는 질문

변수 이름을 줄이지 않는 이유는요?
이름 변경에는 제대로 된 파서와 스코프 분석이 필요하고, 거기서 미세하게 틀리면 「한동안은 돌아가다가 언젠가 멈추는 파일」이 나옵니다. 사용자 앞에 내놓을 것이라면 약속을 덜 하고 늘 맞는 쪽이 낫습니다. 마지막 몇 퍼센트가 필요하면 빌드에서 esbuild나 terser를 쓰세요.
정규식과 나눗셈을 구별하나요?
구별합니다. 파싱 없이 JavaScript를 읽을 때 유일하게 어려운 부분입니다. 값이나 닫는 괄호 뒤의 슬래시는 나눗셈, 연산자·여는 괄호·쉼표 뒤, return 이나 typeof 같은 단어 뒤, 또는 맨 앞의 슬래시는 정규식의 시작으로 봅니다. x = /ab+c/g 와 return /a b/.test(s) 는 공백까지 그대로 남고, total / 2 는 나눗셈 그대로입니다.
세미콜론 자동 삽입이 깨지지 않나요?
깨지지 않습니다. 줄바꿈이 세미콜론을 대신할 수 있으므로, 앞 줄이 연산자·쉼표·여는 괄호로 끝나거나 이 줄이 닫는 괄호·점·쉼표로 시작할 때만 줄을 잇습니다. ++ 나 -- 로 끝나는 줄, 정규식으로 끝나는 줄은 줄바꿈을 남기므로 세미콜론을 쓰지 않는 코드도 그대로 동작합니다.
라이선스 주석은 지워지나요?
지워지지 않습니다. /*! 로 시작하는 블록과 @license 나 @preserve 가 들어간 주석은 줄바꿈까지 쓴 그대로 따로 한 줄에 남깁니다. 나머지 // 와 /* */ 주석은 /** 로 시작하는 JSDoc 까지 모두 없앱니다.
절감률은 바이트 기준인가요?
아니요, 글자 수 기준입니다. 변환 전·후 숫자는 JavaScript가 세는 텍스트 길이입니다. 영문과 숫자만 있으면 바이트 수와 같지만 한글은 UTF-8에서 한 글자 3바이트이므로, 한글 주석이 많은 파일일수록 바이트로 본 절감은 표시된 비율보다 큽니다.
입력한 내용이 어디로 전송되나요?
아니요. 브라우저 안에서 동작하므로 붙여넣은 내용은 내 컴퓨터를 떠나지 않습니다.

관련 도구

◒ CSS 정리 한 줄에 선언 하나, 아니면 전부 한 줄. ‹› HTML 정리 읽으려면 펼치고, 보내려면 줄이고. {} JSON 포맷터 JSON을 붙여 넣으면 바로 정렬하거나 압축하거나 검사합니다. 데이터는 이 페이지를 벗어나지 않습니다. ∿ Base64 텍스트를 Base64로, Base64를 텍스트로. UTF-8을 정확히 처리하고 URL 안전 문자표도 고를 수 있습니다.