콘텐츠 효율성 최적화

Ilya Grigorik
Ilya Grigorik

Google의 웹 애플리케이션은 계속해서 범위, 목표 및 기능 면에서 성장하고 있습니다. 이는 좋은 일입니다. 그러나 더욱 풍부한 웹으로의 끊임없는 행진은 또 다른 트렌드를 주도하고 있습니다. 각 애플리케이션에서 다운로드하는 데이터의 양이 꾸준한 속도로 계속 증가하고 있습니다. 최적의 성능을 제공하기 위해서는 모든 바이트 하나하나의 전달을 최적화해야 합니다.

최신 웹 애플리케이션은 어떤 모습일까요? HTTP 아카이브가 이러한 질문에 답하는 데 도움이 될 수 있습니다. 이 프로젝트는 가장 인기 있는 사이트 (Alexa Top 1M 목록에 등재된 300,000개 이상의 사이트)를 주기적으로 크롤링하고 각 개별 대상에 대한 리소스 수, 콘텐츠 유형 및 기타 메타데이터에 대한 분석을 기록하고 취합하여 웹이 어떻게 구축되었는지 추적합니다.

HTTP 보관 트렌드

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 3,486KB

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

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

데스크톱과 달리 웹 애플리케이션은 별도의 설치 프로세스가 필요하지 않습니다. URL을 입력하면 바로 실행됩니다. 이것이 웹의 핵심 기능입니다. 하지만 이를 실현하기 위해 수십, 경우에 따라서는 수백 개의 다양한 리소스를 가져와야 하는 경우가 많습니다. 이러한 모든 리소스는 모두 합쳐 최대 메가바이트에 이를 수 있으며, Google에서 목표로 하는 즉각적인 웹 경험을 촉진하기 위해서는 수백 밀리초 내에 통합되어야 합니다.

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