HTML 압축기(Minifier)

HTML을 압축하면 브라우저가 무시하는 주석, 들여쓰기, 블록 요소 사이의 줄바꿈, 불필요한 속성 값이 사라져 페이지를 조금 더 빨리 내려받고 파싱합니다. 이 압축기는 무작정 찾아 바꾸는 대신 마크업을 토큰으로 나누므로, <pre>와 <textarea> 안의 공백은 그대로 두고, 인라인 단어 사이의 공백 하나는 남기며, 따옴표로 묶은 속성 값은 깨뜨리지 않습니다.

사용 방법

1. HTML 페이지나 조각을 붙여 넣습니다.
2. 무엇을 지울지 고릅니다. 주석, 여분의 공백, 불필요한 속성, 속성 따옴표입니다.
3. 원래 서식이 필요한 경우가 아니면 인라인 CSS와 JSON 압축은 켜 둡니다.
4. 압축된 HTML을 복사하고 줄어든 바이트를 확인합니다.

계산식

절감 % = (원본 바이트 − 압축 후 바이트) ÷ 원본 바이트 × 100

크기는 UTF-8 바이트 기준입니다. 연속된 공백은 공백 하나가 되며, 블록 수준 태그(div, p, li, td 등) 옆의 공백과 head 안 요소 사이의 공백은 화면에 나타나지 않으므로 제거합니다. select, svg, video 같은 인라인 상자 옆과 스크립트 및 유지하는 주석 주위의 공백은 남깁니다. type="text/javascript"와 type="text/css"는 기본값이라 지우고, checked="checked" 같은 불리언 속성은 checked가 됩니다.

예시

25바이트 조각 <p> + 줄바꿈 + a b + 줄바꿈 + </p> + 줄바꿈은 <p>a b</p>로 압축되어 10바이트가 됩니다. 블록 태그 옆의 공백이 사라지고 두 단어 사이의 공백이 하나로 합쳐져 60% 줄어듭니다.