CSS 축소

공백, 줄바꿈, 들여쓰기, 주석은 사람이 스타일시트를 읽기 쉽게 해 주지만 브라우저에는 필요하지 않습니다. CSS를 붙여 넣으면 축소된 코드가 입력하는 즉시 나타나며, 바이트 단위의 크기와 줄어든 양도 표시됩니다. 아무것도 바꾸지 않는 부분만 제거합니다. nav a 같은 하위 선택자의 공백은 nava가 다른 선택자가 되므로 남기고, calc()에 필요한 공백도 남깁니다. 보통 라이선스가 들어 있는 /*!로 시작하는 주석도 유지됩니다.

같은 도구로 HTML과 JavaScript도 축소할 수 있습니다. 입력란 위에서 언어를 선택하세요. HTML에서는 ‘주석 제거’가 주석을 삭제하고, ‘내부의 CSS와 JavaScript도 함께 축소’는 페이지의 스타일 블록과 스크립트 블록도 축소합니다. JavaScript는 먼저 브라우저가 검사하며, 코드에 오류가 있으면 축소하는 대신 오류를 보여 줍니다. 축소는 서버의 gzip이나 Brotli 압축과 함께 쓰면 효과가 더해집니다. 둘은 파일을 줄이는 방식이 다르기 때문입니다. 코드는 어디로도 전송되지 않습니다.