谷歌 Web 开发最佳实践手册(4.2):优化内容的加载效率

【伯乐在线提示】:① 5月6日,谷歌开发者中心推出了一个 Web 开发最佳实践手册。伯乐在线资源频道摘编该资源后,已邀请一些关注 Web 开发的朋友参与翻译手册。② 由于译者朋友几乎都是已在职,都是在工作之余参与,每位的翻译进度会不一样(请理解),所以手册中文版不会按照英文版章节顺序发布。③ 手册中文版尚不完整,请不要转载,谢谢合作。

【导读】:我们的Web应用程序在规模、野心和功能上持续成长 ——这是一件好事。然而,向着更丰富的Web无情进军的过程,也推动了另一种趋势:每个应用程序下载的数据量也在持续稳步增长。为了提供强大的性能,我们需要优化每个字节的加载!

一个现代Web应用程序,应该是什么的样子? HTTP 档案馆可以帮我们回答这个问题。该项目通过定期抓取最受欢迎的网站(Alexa最热百万网站列表中的三十多万个网站),来跟踪Web的建设,同时记录和汇总分析了每个目标网站的资源数、内容类型和其他元数据。

 

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年初,处于中位数的网站需要进行75次连接请求,加载共1054 KB字节的数据,这一需要加载的数据量(以及连接请求数)在上一年中以稳定的步伐增长着。这本身并不值得意外,但它确实带来了重要的性能影响:的确,网速是越来越快了,但它在不同国家的增长速度并不一样,而许多用户仍受制于速度瓶颈和昂贵的网络套餐价格——尤其在移动端。

和桌面应用程序不同,Web应用程序并不需要一个单独的安装过程:输入网址,它们就被启动和运行了——这是Web应用程序的一个关键特征。但是,要做到这一步,们经常需要加载几十个、有是几百个各种源,它们加起来可达几兆字节的数据量,并且必在几百毫秒内融合起来,以实现我们想要的即

实现以这些要求为前提的即时网络体验,是不小的壮举,这就是为什么优化内容的加载效率是至关重要的:消除不必要的下载,通过各种压缩技术来优化资源的传输编码,并利用高速缓存来消除多余的下载。

 

课程

  1. 消除不必要的下载 —— 最快和最好地优化过的资源,是不需要加载的资源。你最近经审查过你的资源吗?你应该这么做,而且你应该定期这么做,以确保每个资源都在帮你提供更好的用户体验。
  2. 优化文本资源的编码和传输 —— 消除了不必要的下载资源,下一步就是尽量压缩浏览器必须下载的资源规模,即在它们身上运行针对特定内容类型的、以及普遍通用的压缩算法(GZip压缩)。(伯乐在线注:此部分正在翻译中……)
  3. HTTP缓存 ——通过网络加载某些东西既缓慢又昂贵:大的资源加载,往往需要在客户端和服务器之间进行多次来回,直到它可以被浏览器进行处理,这造成了用户数据访问的高昂成本。所以,缓存和重用已获取资源的能力,是性能优化的一个重要方面。(伯乐在线注:此部分正在翻译中……)
收藏 评论

关于作者:兔米酱

飘在德国的前端攻城女狮子!(新浪微博:@兔八百) 个人主页 · 我的文章 · 2

相关文章

可能感兴趣的话题



直接登录
跳到底部
返回顶部