[Nginx] Static 파일을 캐싱해서 웹 페이지 로딩 속도를 높이자

static file 캐싱을 사용하기 전 로딩 속도 - 15.90s

내가 운영하고 있는 동물의 숲 어플인 너굴리스트다. 그냥 컴퓨터에서 이용할때는 견딜만 하지만, 아이폰의 경우 웹뷰로 띄워서 보여주는데 로딩속도가 무지막지하게 느리다. 사진에서 봐도 Finish까지 15.90s. 이럴때 Nginx에서 css/js/image 파일 등을 캐싱 해 두면 좋다는 조언을 얻었다.

 

방법은 간단하다. nginx 설정 파일에서 자신이 사용하고 있는 location 전에 다음과 같이 또 하나의 location을 선언 해주면 된다.

location ~* \.(?:ico|css|js|gif|jpe?g|png)$ {
    expires 30d;
    add_header Vary Accept-Encoding;
    access_log off;
}

 

그리고나서 nginx 설정에 문법이 틀린 것이 없는지 검사 후 재시작한다!

sudo nginx -t && sudo service nginx reload

static file 캐싱을 사용 후 - 6.52s