HTML·CSS·JS 파일은 텍스트 특성상 압축 효율이 매우 높아서, 서버의 압축 전송(Gzip 또는 Brotli) 기능만 켜도 전송 용량을 60~80%까지 줄일 수 있습니다. 이미지 최적화 없이도 즉시 적용 가능한 이 설정을 실제 서버별로 켜는 방법과 확인 절차를 정리합니다.
압축 전송이 줄이는 것과 줄이지 못하는 것
서버 압축은 텍스트 기반 파일(HTML, CSS, JS, JSON, SVG)에 효과가 큽니다. 반면 이미 압축된 형식인 JPG, PNG, WebP, 대부분의 동영상 파일은 다시 압축해도 크기가 거의 줄지 않고, 오히려 서버 리소스만 낭비될 수 있어 압축 대상에서 제외해야 합니다.
Gzip vs Brotli, 무엇을 써야 하나
| 구분 | 압축률 | 브라우저 지원 | 서버 부하 |
|---|---|---|---|
| Gzip | 보통 | 거의 모든 브라우저 | 낮음 |
| Brotli | Gzip보다 15~20% 더 높음 | 대부분 최신 브라우저 | |
| 둘 다 지원 안 하는 구형 클라이언트 | - | 비압축 원본 전송(폴백) |
가능하면 Brotli를 우선 적용하고, Brotli를 지원하지 않는 클라이언트에는 Gzip으로 자동 폴백되게 설정하는 것이 일반적입니다.
Nginx 설정 예시
gzip on;
gzip_types text/plain text/css application/javascript application/json
text/xml application/xml image/svg+xml;
gzip_min_length 256;
# Brotli는 별도 모듈(ngx_brotli) 설치 필요
brotli on;
brotli_types text/plain text/css application/javascript application/json
text/xml application/xml image/svg+xml;gzip_min_length로 너무 작은 파일은 압축 대상에서 제외해, 압축 처리 비용이 이득보다 커지는 상황을 방지합니다.
Apache(.htaccess) 설정 예시
<IfModule mod_deflate.c> AddOutputFilterByType DEFLATE text/html text/css application/javascript AddOutputFilterByType DEFLATE application/json image/svg+xml </IfModule>
공유 호스팅 환경이라면 서버 관리자 권한이 없어 직접 모듈을 설치할 수 없는 경우도 있어, 호스팅사에 압축 모듈 활성화 여부를 먼저 문의해야 합니다.
적용 여부를 직접 확인하는 방법
# 응답 헤더에 Content-Encoding이 포함되는지 확인 curl -H "Accept-Encoding: gzip, br" -I https://example.com/style.css
응답에 Content-Encoding: br 또는 Content-Encoding: gzip이 보이면 정상 적용된 상태입니다. 브라우저 개발자도구의 네트워크 탭에서도 각 리소스의 응답 헤더로 동일하게 확인할 수 있습니다.
압축과 함께 봐야 하는 캐시 헤더 설정
압축은 매 요청마다 전송 용량을 줄이지만, 캐시 설정은 재방문 시 요청 자체를 없애는 역할을 합니다. 둘은 상호 보완적이므로 함께 적용해야 효과가 극대화됩니다.
location ~* \.(css|js|svg)$ {
expires 30d;
add_header Cache-Control "public, immutable";
} 압축 적용 전후 효과 확인 지표
- 페이지스피드 인사이트에서 "텍스트 압축 사용" 경고 해소 여부
- 네트워크 탭에서 전송 크기(Transferred) vs 실제 크기(Resource Size) 비교
- 모바일 3G/LTE 환경 시뮬레이션에서 로딩 시간 개선 폭
동적 페이지(PHP 응답)에도 압축이 적용되나요
정적 파일뿐 아니라 PHP가 매번 새로 생성하는 게시판 목록·검색 결과 같은 동적 HTML 응답도 압축 대상입니다. 웹서버 레벨의 gzip/brotli 설정은 정적 파일과 동적 응답을 구분하지 않고 Content-Type 기준으로 동작하기 때문에, PHP 응답의 Content-Type이 text/html로 정확히 설정되어 있다면 별도 작업 없이 함께 압축됩니다.
PHP 자체에서도 zlib.output_compression 설정으로 압축을 켤 수 있지만, 웹서버 레벨 설정과 중복 적용되면 이중 압축 오류가 날 수 있어 한 곳에서만 압축을 처리하도록 통일해야 합니다.
실무 정리
서버 압축은 코드를 거의 건드리지 않고 설정 한 줄로 효과를 보는 대표적인 최적화입니다. 이미지 용량 절감이 필요하다면 WebP 변환 파이프라인을 함께 적용하는 것을 권장합니다. 서버 설정 최적화가 필요하면 무료 견적요청으로 현재 서버 환경을 알려주세요.
자주 묻는 질문 (FAQ)
이미지 파일도 압축 설정에 포함시켜야 하나요? +
JPG, PNG, WebP 등은 이미 압축된 포맷이라 서버 압축을 다시 적용해도 거의 효과가 없고, 오히려 서버 처리 부담만 늘어날 수 있어 제외하는 것이 일반적입니다.
압축을 켜면 서버 CPU 부담이 늘어나나요? +
약간의 CPU 사용이 늘지만, 최신 서버에서는 미미한 수준입니다. 트래픽이 매우 많은 경우 압축 레벨을 낮추거나 CDN 레벨에서 압축을 처리하는 방식으로 부담을 분산할 수 있습니다.
압축을 적용했는데 헤더에 Content-Encoding이 안 보입니다. +
해당 파일 형식이 압축 대상 목록(gzip_types 등)에 포함되어 있는지, 파일 크기가 최소 압축 기준보다 큰지, 서버 설정이 실제로 재시작·반영됐는지 확인하세요.
압축과 CDN을 같이 쓰면 중복 압축이 발생하나요? +
CDN이 오리진에서 이미 압축된 응답을 그대로 전달하는 방식이 일반적이라 중복 압축 문제는 거의 없습니다. 다만 CDN 자체 압축 설정도 켜져 있는지 별도로 확인하는 것이 안전합니다.
공유 호스팅에서도 Brotli를 쓸 수 있나요? +
호스팅사가 서버 모듈을 제공하는 경우에만 가능합니다. 지원하지 않는다면 Gzip만으로도 상당한 효과를 볼 수 있어 우선 Gzip을 적용하는 것을 권장합니다.
압축 레벨(품질)은 몇으로 설정하는 게 좋나요? +
Gzip은 보통 5~6 수준이 압축률과 서버 부하의 균형점으로 권장되며, 레벨을 최대(9)로 올려도 파일 크기 개선은 미미한 반면 CPU 사용량은 크게 늘 수 있습니다.
API 응답(JSON)도 압축 대상에 포함해야 하나요? +
네, JSON은 텍스트 기반이라 압축 효율이 높습니다. 특히 목록형 API 응답처럼 크기가 큰 경우 압축 설정에 application/json을 반드시 포함해야 합니다.
압축 설정을 바꾼 뒤 브라우저 캐시 때문에 확인이 어렵습니다. +
개발자도구 네트워크 탭에서 캐시 비활성화(Disable cache) 옵션을 켜고 새로고침하면 매번 서버에서 새로 응답을 받아 정확한 헤더를 확인할 수 있습니다.