CSS 압축
엄격한 파싱으로 오류의 행과 열을 짚는 로컬 Worker에서 CSS를 압축하고 /*! 라이선스 주석은 그대로 남깁니다.
도구 열기 — CSS 압축CSS 압축 vs CSS 포맷터
결론부터: CSS Minifier는 스타일시트를 배포용으로 작게 만듭니다. 엄격하게 파싱하고, 오류를 행과 열로 보고하며, 주석과 공백을 제거하고, /*! 라이선스 주석은 유지합니다. 바이트 통계가 포함됩니다. CSS Formatter는 읽기 좋게 만듭니다. 파싱된 규칙을 2칸 또는 4칸 들여쓰기로 다시 정렬합니다. 프로덕션 페이로드냐 작업 복사본이냐의 차이입니다.
| CSS 압축 | CSS 포맷터 | |
|---|---|---|
| 용도 | 엄격한 파싱으로 오류의 행과 열을 짚는 로컬 Worker에서 CSS를 압축하고 /*! 라이선스 주석은 그대로 남깁니다. | CSS를 2 또는 4공백 들여쓰기의 읽기 쉬운 규칙으로 재정렬합니다. 기기 안의 로컬 Worker에서 엄격하게 파싱합니다. |
| 입력 | 256 KiB 이하의 CSS. 로컬 Worker에서 엄격하게 파싱 | 256 KiB 이하의 CSS. 로컬 Worker에서 엄격하게 파싱 |
| 출력 | 바이트 통계가 있는 축소된 CSS. /*! 라이선스 주석 유지 | 같은 규칙을 2 또는 4칸 들여쓰기로 다시 정렬한 읽기 쉬운 형식 |
| 전형적인 사용 | 프로덕션 배포용 스타일시트 축소 | 압축되었거나 들여쓰기가 엉망인 CSS 읽기·정리 |
핵심 차이
미니파이어는 배포를 위해 CSS를 축소합니다. 포맷터는 사람이 읽고 편집하기 쉽게 같은 언어를 다시 들여씁니다.
둘 다 256 KiB 이하의 CSS를 로컬 Worker에서 엄격하게 파싱합니다. 어느 쪽도 스타일시트를 실행하지 않습니다.
미니파이어는 /*! 주석을 유지한 단일 행 출력과 절약된 바이트를 보고합니다. 포맷터는 같은 규칙을 일관되게 들여쓴 결과를 출력합니다.
프로덕션 에셋이면 미니파이어. 검토할 소스면 포맷터입니다.
엄격한 파싱으로 오류의 행과 열을 짚는 로컬 Worker에서 CSS를 압축하고 /*! 라이선스 주석은 그대로 남깁니다.
도구 열기 — CSS 압축CSS를 2 또는 4공백 들여쓰기의 읽기 쉬운 규칙으로 재정렬합니다. 기기 안의 로컬 Worker에서 엄격하게 파싱합니다.
도구 열기 — CSS 포맷터관련 비교