웹 최적화 – 압축해서 전송하기

웹 최적화 – 압축해서 전송하기

개요 : 서버에서 gzip으로 php, css, js 파일을 압축해서 전송하여 트래픽을 줄이고, 페이지 로딩 속도를 높인다.

 

방법 1 : .htaccess 파일을 수정.


mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*

 

위 코드를 .htaccess에 추가하면 서버에서 html, txt, css, js, php 파일을 압축해서 전송해서 트래픽을 줄여줄 뿐 아니라 웹페이지 로딩 속도도 높여준다.

일반적으로 이미지는 압축해서 전송하지 않는다. 이미지는 압축되어있는 경우가 대부분이고 한번 더 압축할 경우, 오히려 용량이 늘어나는 경우가 많다. 그래도 이미지 압축까지 추가하려면 아래 코드를 중간에 추가해준다.

mod_gzip_item_exclude mime ^image/.*

 

만약 아파치 서버에 DEPLATE 모듈이 설치되어 있다면 아래와 같이 해도 좋다.


<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE font/opentype font/ttf font/eot font/otf
</IfModule>

사용 중인 서버에서 gzup 모듈이 설치되어 있는지 확인하려면
아래 링크를 클릭해서 홈페이지 주소를 입력한다.

http://www.feedthebot.com/tools/gzip/

pic1

 

 

2. 아파치 서버에서 설정 변경

서버의 설정을 직접 수정할 수 있다면 아파치 설정에서 아래 코드를 추가한다.

AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript

 

 

3. NGINX 서버의 경우

 


gzip on;
gzip_comp_level 2;
gzip_http_version 1.0;
gzip_proxied any;
gzip_min_length 1100;
gzip_buffers 16 8k;
gzip_types text/plain text/html text/css application/x-javascript text/xml application/xml application/xml+rss text/javascript;
# Disable for IE < 6 because there are some known problems
gzip_disable "MSIE [1-6].(?!.*SV1)";
# Add a vary header for downstream proxies to avoid sending cached gzipped files to IE6
gzip_vary on;