코드 압축기

참고

코드 최소화란?

코드 최소화는 소스 코드에서 공백, 주석, 줄 바꿈, 선택적 구분자 등 불필요한 문자를 코드 동작 변경 없이 제거합니다. 결과 파일은 더 작아져 네트워크에서 더 빠르게 다운로드됩니다. 최소화는 모든 현대 프론트엔드 빌드 파이프라인의 표준 단계이며, HTML, CSS, JavaScript에 대해 Google 웹 성능 가이드라인에서 권장합니다.

HTML 최소화

HTML 최소화는 HTML 주석(<!-- ... -->)을 제거하고 태그 사이의 공백을 압축합니다. 브라우저는 HTML의 추가 공백을 무시하므로 제거해도 시각적 효과가 없지만 파일 크기가 줄어듭니다. 일반적인 HTML 최소화 절약량은 서식 스타일과 주석 밀도에 따라 10~25%입니다. 인라인 <style>과 <script> 블록은 각 언어별 최소화를 통해 추가로 최적화할 수 있습니다.

CSS 최소화

CSS 최소화는 주석(/* ... */)을 제거하고, 공백을 압축하며, {, }, :, ;, , 주변의 공백을 제거합니다. 또한 CSS 파서가 생략을 허용하는 } 앞의 마지막 세미콜론도 제거합니다. 주석이 많은 CSS 파일은 일반적으로 20~40% 크기 감소를 보입니다. 프로덕션에서는 cssnano나 Lightning CSS 같은 도구가 중복 규칙 병합, 색상 단축(#ffffff → #fff), 불필요한 접두사 제거까지 수행합니다.

JavaScript 최소화

이 도구는 보수적인 JavaScript 최소화를 수행합니다: 한 줄 주석(// ...), 여러 줄 주석(/* ... */)을 제거하고 공백을 압축합니다. 안전하고 빠르지만 완전한 최적화 도구는 아닙니다 — 변수 이름을 바꾸거나, 미사용 export를 트리셰이킹하거나, 데드 코드를 제거하지 않습니다. 프로덕션 빌드에는 전용 도구를 사용하세요: Terser(Webpack/Vite 표준), esbuild(매우 빠른 Go 기반), SWC(Rust 기반, Next.js에서 사용). 이 도구들은 최소화와 변수 난독화를 결합하여 40~70% 크기 감소를 달성합니다.

개인정보

모든 처리는 100% 브라우저에서 실행됩니다. 서버로 데이터가 전송되지 않습니다.