17
2017-Sep
[web] 페이지 속도 개선
작성자: Blonix
IP ADRESS: *.64.228.3 조회 수: 1379
https://developers.google.com/speed/pagespeed/
들어가서 분석 원하는 사이트 url 넣고 돌려보자
1. 브라우저 캐싱 : 캐시 재로드를 원하면 크롬기준 Ctrl+F5 누르거나 캐시를 지우면 됨
출처 :: https://www.phpschool.com/gnuboard4/bbs/board.php?bo_table=tipntech&wr_id=56733
httpd.conf 에 간단히
{p.s.
CentOS이면 /etc/httpd/conf/httpd.conf
우분투이면 /etc/apache2/apache2.conf
}
ExpiresActive On
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType application/x-javascript "access plus 1 month"
ExpiresByType text/css "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
요렇게 해 주면 js, css, images 는 브라우저 캐시를 이용하게 됩니다.
그러면 한번 불러온 저 파일들은 뒤로,앞으로 이동시에 다시 불러오지 않습니다.
오직 새로고침시에만 다시 불러옵니다.
아래는 플래시,이미지,음악까지 적용된 코드
ExpiresByType image/bmp "access plus 1 month"
ExpiresByType image/cgm "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/tiff "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType video/mpeg "access plus 1 month"
ExpiresByType video/quicktime "access plus 1 month"
ExpiresByType video/x-msvideo "access plus 1 month"
ExpiresByType audio/basic "access plus 1 month"
ExpiresByType audio/midi "access plus 1 month"
ExpiresByType audio/mpeg "access plus 1 month"
ExpiresByType audio/x-aiff "access plus 1 month"
ExpiresByType audio/x-mpegurl "access plus 1 month"
ExpiresByType audio/x-pn-realaudio "access plus 1 month"
ExpiresByType audio/x-wav "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
---------------------------
Invalid command 'ExpiresActive', perhaps mis-spelled or defined by a module not included in the server configuration
-> 오류 발생시 CentOS 의 경우 위 파일에 LoadModule expires_module modules/mod_expires.so 추가
-> 우분투의 경우 터미널에서 a2enmod expires 실행
---------------------------
+ 파일 다운로드 php 에는
header('Pragma: cache'); // 아파치가 자동으로 no-cache 를 붙이기 때문에 넣었습니다.
header('Cache-Control: max-age=2592000');
header('Expires: '.substr(gmdate('r', strtotime('+1 MONTH')), 0, -5).'GMT');
요렇게 해주면 됩니다.
그리고 트래픽 개선을 위해 html을 최소화하는게 좋다.
특히 class 를 무분별하게 남발하지 말고 계층구조를 효과적으로 활용해 css 를 구성하면 html이 훨씬 가벼워진다.
css와 js는 캐싱된 데이터의 활용도가 높음을 기억하자.