优化内容效率

伊利亚·格里戈里克
Ilya Grigorik

我们的 Web 应用在范围、目标和功能上都在不断增长,这是一件好事。然而,人们对更丰富的 Web 的不懈追求正在推动另一个趋势:每个应用下载的数据量继续稳步增长。为了提供卓越的性能,我们需要优化每个字节的传送!

现代 Web 应用是什么样子?HTTP Archive 可帮助我们回答此问题。该项目通过定期抓取最热门的网站(Alexa 百万热门网站列表中的 300,000 多个网站)并记录和汇总每个单独目的地的资源数量、内容类型和其他元数据的分析数据,来追踪网络的构建情况。

HTTP 归档趋势

第 50 百分位 第 75 个百分位 第 90 百分位
HTML 13 KB 26 KB 54 KB
图片 528 KB 1,213 KB 2,384 KB
JavaScript 207 KB 385 KB 587 KB
CSS 24 KB 53 KB 108 KB
其他 282 KB 308 KB 353 KB
总计 1,054 KB 1985 KB 3486 KB

以上数据捕获了 2013 年 1 月至 2014 年 1 月期间网上热门网站的下载字节数增长趋势。当然,并非每个网站的增长速度都一样,也并非每个网站的增长速度都相同,因此,我们之所以突出显示分布范围内的不同分位数,分别是:第 50 位(中位数)、第 75 位和第 90 位。

到 2014 年初,一个中位数网站需要处理 75 个请求,这些请求的总传输字节数达到了 1054 KB,并且总字节数(和请求数量)在过去一年中稳步增长。这本身并不那么出人意料,但确实带来了重要的性能影响:没错,网速越来越快,但不同国家的网速各不相同,而且许多用户仍要受流量上限和昂贵的按流量计费方案的限制,在移动设备上尤其如此。

与桌面应用不同,Web 应用不需要单独的安装过程:只需输入网址即可启动并运行 - 这是 Web 的一项关键功能。然而,要做到这一点,我们通常需要提取数十种(有时甚至数百种)各种资源,所有这些资源加起来的数据量可能达到 MB,并且必须在数百毫秒内汇集在一起,以提供我们想要的即时网络体验。

满足这些要求实现即时网络体验绝非易事,因此优化内容效率至关重要:消除不必要的下载,通过各种压缩技术优化每个资源的传输编码,并尽可能利用缓存来消除冗余下载。