jQuery CDN 속도 비교와 사이트 속도향상을 위한 선택

정말 오랜 시간 동안 블로그를 방치해 놓다가 요즘 들어 다시 블로그에 대한 열정이 샘솟아서 블로그 관리에 신경을 쓰고 있습니다.

다시 블로그를 손보면서 가장 먼저 한 작업은 새 글 포스팅과 블로그 스킨 변경을 진행했습니다. 블로그를 만들었던 초기의 스킨을 이 블로그 나름의 Identity로 생각해서 여태껏 변경하지 않고 사용하고 있었네요.

벌써 한 스킨을 10년 넘게 사용했으니 이제는 낡은 스킨을 바꿔야 할 시기가 왔습니다. 예전과는 다르게 요즘엔 모바일에서 인터넷 사용이 많으니 모바일 사용성을 우선하여 스킨을 골랐습니다.

딱히 마음에 드는 스킨이 없던 찰나에 웹에서 스킨이 마음에 쏙 드는 블로그를 발견했습니다. 그리고 그 스킨을 바로 적용하기 시작했지요.

CDN 이란?

스킨을 적용하고 한 가지 문제를 발견했습니다. 블로그의 로딩 속도가 너무 느리다는 것이지요. 블로그가 왜 느린지 이것저것 점검해보다 스킨에 사용되는 jQuery의 CDN의 속도 문제라는 것을 알게 되었습니다.

CDN이 무엇인지는 잘 설명되어있는 블로그가 있으니 아래링크를 참고해 보시면 될 것 같습니다.

CDN(Contents Delivery Network) 이란?

“CDN을 사용하면 콘텐츠가 해당 지역에 최적화된 위치의 서버에서 전달받아 더 빨리 제공되어 사이트의 트래픽도 분산되고 속도도 빨라질 것이다.”라는 막연한 생각으로 많이 사용합니다. 저 역시 그렇게 알고 있었고 믿고 있었는데 적어도 한국에서는 CDN 선택에 조금 더 고민해 봐야 할 것 같습니다.

CDN 별 속도 비교

jQuery CDN 속도문제

해당 블로그에서는 2010년에 CDN 속도 비교와 함께 속도 문제가 있었고, 2015년에도 여전히 속도 문제가 존재한다는 내용입니다. 그리고 2020년 지금 시점에 저도 동일한 문제를 겪게 되어 블로그에 글을 쓰게 되었고요.

저는 jQuery를 google CDN을 이용하도록 작성되어있는 스킨의 CDN 정보를 MS의 CDN을 사용하도록 변경하여 속도 문제를 개선했습니다. 꽤 체감이 될 정도로 로딩 속도가 좋아졌습니다. 그리고, 오늘 블로그 포스팅을 위해서 CDN별 응답속도 테스트를 진행했습니다.

테스트는 5회 진행을 하고 평균값을 산출했습니다.

서비스 제공자	1회차	2회차	3회차	4회차	5회차	평균
jQuery.com (code.jquery.com)	70ms	68ms	61ms	63ms	75ms	67.4ms
Google CDN (ajax.googleapis.com)	60ms	61ms	60ms	61ms	60ms	60.4ms
Microsoft CDN (ajax.aspnetcdn.com)	29ms	29ms	29ms	29ms	29ms	29ms
CDNJS CDN (cdnjs.cloudflare.com)	3ms	3ms	3ms	3ms	3ms	3ms
jsDelivr CDN (cdn.jsdelivr.net)	2ms	2ms	2ms	3ms	3ms	2.4ms

테스트를 진행하면서 결과를 보고 조금 놀랐습니다. CloudFlare와 jsDelivr의 응답속도가 무척 빨라서인데요. 테스트를 진행하면서 MS CDN으로 변경해 놓았던 스킨의 정보들을 바로 jsDelivr로 변경했습니다.

기분 탓인지는 몰라도 블로그의 로딩 속도가 개선된 것처럼 느껴집니다. Google에서 MS로 변경했을 때도 체감이 되었었는데, jsDelivr는 더  빠릿빠릿한 느낌입니다.

느릿하게 동작하던 속도도 개선하고 스킨도 새로워졌으니 새로운 마음으로 블로그를 꾸준히 쓰려 합니다.

더불어 오늘 테스트해본 내용은 블로그 외에 개인적으로 개발하는 프로그램에도 참고해 봐야겠습니다.

---