0.
구글 PageSpeen 툴을 사용하면 내 사이트가 왜 느린지 분석해볼 수 있다.
새로 만든 페이지가 너무 느려서(40초 도랏;;) 원인을 뒤지던 중 발견했는데
이거 기준으로 하나하나 해결해 나가니까 훨씬 빨라졌다.
"물론 이 점수가 반드시 페이지 속도에 비례하진 않는다. 점수가 높아도 느리거나, 점수가 낮아도 빠른 경우도 많다."
1.
이미지를 최적화하자.
아래 사이트에서 png, jpg 등의 이미지들을 최적화 할 수 있다.
비슷한 화질로 95% 가량 줄이니 네트워크를 통해 가져오는 이미지 용량이 격하게 줄어들었다.
2.
CSS, js 파일을 최적화하자.
이전 포스팅 참조.
덧붙여 CDN을 사용한다면 꼭 min 파일을 사용하도록 하자.
3.
브라우저 캐싱을 활성화시키자.
css, js 처럼 자주 바뀌는 파일의 경우엔 24시간 정도, 이미지와 같이 내용이 거의 바뀌지 않는 경우는 한 달 정도로 캐싱하자.
난 nginx를 사용해서 nginx 설정에서 Cache-Control 을 추가했다.
$ cd /etc/nginx/sites-available
$ vi default
경로는 사람마다 다를 수 있음. 어쨌든 sites-available 내용을 바꿔주는 거다.
파일에 다음을 추가한다.
location ~* \.(?:jpg|jpeg|gif|png|ico|cur|gz|svg|svgz|mp4|ogg|ogv|webm|htc)$ {
expires 1M;
add_header Cache-Control "public";
}
+ nginx Cache-Control 에 대해 더 알고 싶다면, https://serversforhackers.com/c/nginx-caching
'개발 > web' 카테고리의 다른 글
Netlify에서 Vue router (0) | 2019.11.27 |
---|---|
재미있는 REST API 파라미터의 종류와 개요 (2) | 2019.03.08 |
HTTP와 HTTPS (2) | 2019.02.13 |
html/CSS에 쓸만한 사이트 모음 (0) | 2016.03.18 |
댓글