[YUI] Maximizing Parallel Downloads in the Carpool Lane

making web/javascript 2008.11.10 23:58
/http://yuiblog.com/blog/2007/04/11/performance-research-part-4/

HTTP/1.1 명세에 따르면 브라우저가 호스트당 두 개의 컴포넌트를 병렬적으로 다운로드 받는 것을 권장하고 있다. 대부분의 웹 페이지에선 하나의 호스트에서 받아오는게 보통.  그림 1처럼 계단식 패턴을 보이게 된다.


만약, 웹페이지가 두 개의 호스트에서 컴포넌트를 받아온다면, 응답 속도는 두 배로 빨라질 것이다.


병렬적인 다운로드를 호스트당 두 개씩이라는 건 그저 가이드라인이다. 기본적으로 IE, FF 모두 이 가이드라인을 따르고 있지만 사용자는 이 설정을 조절할 수 있다[각주:1].

HTTP/1.0에선 FF은 기본으로 호스트당 8개를 병렬적으로 다운로드하는게 기본값이다. 보나마나 그림 2보다 빠를테다.

사용자를 배제하고 서버에서 별 공수들이지 않고도 컴포넌트를 다수의 호스트로 분산시켜 다운받게 할 수 있다. 사용자의 bandwidth, CPU speed, 과도한 병렬 다운로드가 성능을 다운시킬 수 있다.

빈 HTML에 20개의 이미지를 넣고, 호스트를 1, 2, 3, 4, 5, 10으로 늘려 응답시간을 체크해보았다. 36*36의 작은 사이즈 20개 , 116*61의 중간 사이즈의 이미지 20개를 비교해보면... 중간 사이즈 이미지의 경우는 호스트가 늘어날 수록 응답 시간이 점점 늘어났고, 작은 사이즈 이미지의 경우엔 호스트의 증가에 별 영향을 받지 않았다. 평균적으로 호스트 수가 2개일 때가 가장 응답 시간이 좋았다.


이러한 결과에 영향을 준 범인으로는 사용자 환경에서 CPU를 생각해 볼 수 있다. 필자의 laptop에서 2개에서 20개로 병렬 다운로드가 증가할 때 CPU 사용율이 25%에서 40%까지 뛰었다.(사용자 환경마다 다르긴 하겠으나...)

이 결과는 도메인들이 이미 브라우저에 캐시된 상태에서다. (하루 방문자 중에 40~60%가 빈 캐시인 채로 접근을 한다고 함...)

(DNS lookup의 경우 똑똑한 서버 개발자에게 문의한 결과 별 영향이 없는 기반 구조라 했으니 패스.)

결론적으로 두 개에서 4개 정도의 호스트 숫자가 적당하다. 여튼, 페이지 내에 컴포넌트 숫자를 줄이는게 응답 시간을 개선하는 최고 방법이라는 말씀.





  1. IE <= 7, FF2에서 2개, IE8, FF3에서는 6개가 default. (http://yuiblog.com/blog/2008/07/22/non-blocking-scripts/) [본문으로]
신고


티스토리 툴바