콘텐츠 효율성 최적화

Ilya Grigorik
Ilya Grigorik

웹 애플리케이션은 범위, 야망, 기능 면에서 계속 성장하고 있습니다. 이는 좋은 일입니다. 하지만 더 풍부한 웹을 향한 끊임없는 발전은 또 다른 트렌드를 주도하고 있습니다. 각 애플리케이션에서 다운로드하는 데이터의 양이 꾸준히 증가하고 있습니다. 우수한 성능을 제공하려면 모든 바이트의 전송을 최적화해야 합니다.

최신 웹 애플리케이션은 어떤 모습일까요? HTTP Archive를 사용하면 이 질문에 답할 수 있습니다. 이 프로젝트는 가장 인기 있는 사이트 (Alexa 상위 100만 목록 중 300,000개 이상)를 주기적으로 크롤링하고 각 개별 대상의 리소스 수, 콘텐츠 유형, 기타 메타데이터에 대한 분석을 기록하고 집계하여 웹이 어떻게 구축되는지 추적합니다.

HTTP Archive 트렌드

50번째 백분위수 75번째 백분위수 90번째 백분위수
HTML 13 KB 26 KB 54 KB
이미지 528 KB 1213 KB 2384 KB
JavaScript 207 KB 385 KB 587 KB
CSS 24 KB 53 KB 108 KB
기타 282 KB 308 KB 353 KB
합계 1054 KB 1985 KB 3486 KB

위 데이터는 2013년 1월부터 2014년 1월까지 웹에서 인기 있는 대상의 다운로드 바이트 수 증가 추세를 보여줍니다. 물론 모든 사이트가 동일한 속도로 성장하거나 동일한 양의 데이터를 필요로 하는 것은 아니므로 분포 내에서 50번째 (중앙값), 75번째, 90번째 등 다양한 분위수를 강조하고 있습니다.

2014년 초의 중간 사이트는 총 1054KB의 전송된 바이트를 합산하는 75개의 요청으로 구성되며, 총 바이트 수 (및 요청 수)는 전년도에 걸쳐 꾸준히 증가했습니다. 이것은 그 자체로 놀라운 일은 아니지만 성능에 중요한 영향을 미칩니다. 인터넷 속도가 빨라지고 있지만 국가마다 속도가 빨라지는 속도가 다르며, 많은 사용자가 여전히 데이터 한도와 값비싼 종량제 요금제를 사용하고 있습니다(특히 모바일에서).

데스크톱 애플리케이션과 달리 웹 애플리케이션은 별도의 설치 프로세스가 필요하지 않습니다. URL을 입력하면 바로 실행됩니다. 이것이 웹의 주요 기능입니다. 하지만 이를 위해서는 수십 개, 때로는 수백 개의 다양한 리소스를 가져와야 하는 경우가 많습니다. 이 모든 리소스는 메가바이트 단위의 데이터로 합산될 수 있으며, 목표로 하는 즉각적인 웹 환경을 구현하려면 수백 밀리초 내에 함께 제공되어야 합니다.

이러한 요구사항을 고려할 때 즉각적인 웹 환경을 구현하는 것은 쉬운 일이 아니므로 콘텐츠 효율성을 최적화하는 것이 중요합니다. 불필요한 다운로드를 제거하고, 다양한 압축 기술을 통해 각 리소스의 전송 인코딩을 최적화하고, 가능하면 캐싱을 활용하여 중복 다운로드를 제거해야 합니다.