现代Web的资源/类型/元素--发展趋势
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应用程序的一个关键特征。但是,要做到这一步,我们经常需要加载几十个、有时是几百个各种资源,它们加起来可达几兆字节的数据量,并且必须在几百毫秒内融合起来,以实现我们想要的即时网络体验。
实现以这些要求为前提的即时网络体验,是不小的壮举,这就是为什么优化内容的加载效率是至关重要的:消除不必要的下载,通过各种压缩技术来优化资源的传输编码,并利用高速缓存来消除多余的下载。
http://blog.jobbole.com/67702/
现代Web的资源/类型/元素--发展趋势的更多相关文章
- 好程序员web前端分享CSS元素类型
好程序员web前端分享CSS元素类型 目标 1.元素类型分类依据和元素类型分类 2.元素类型的转换 3.inline-block元素类型的应用 4.置换和非置换元素的概念和应用案例 一.元素类型分类依 ...
- 个人Web工具箱&资源整理(1)
很久就想把使用的工具及收藏的资源整理一番:一是为了传达博客社区的理念:资源共享,而是方便自己及团队快速获取. 学习资源: 首推两个入门级在线参考网站. 1 w3c school. 2 Runoob.c ...
- 极客Web开发资源大荟萃
前端开发已经成为当前炙手可热的技术之一.此次我们总结的前端开发包含了相关技术和流行趋势,希望从中大家可以挖掘你们所需要的,并带给你们最有价值的帮助!原文来自:极客标签 使用代码回放来愉快地学习前端知识 ...
- web.xml中的元素
error-page元素包含三个子元素error-code,exception-type和location.将错误代码(Error Code)或异常(Exception)的种类对应到web应用资源路径 ...
- web开发资源导航
实用工具 前端在线工具 兼容性速查 html5兼容性查询 node-es6支持度 es6兼容性表查询 设备es6支持度 游览器H5支持度 浏览器内核检测工具 手机设备信息检测 浏览器市场份额 文档手册 ...
- AngularJS使用OData请求ASP.NET Web API资源的思路
本篇整理AngularJS使用OData请求ASP.NET Web API资源的思路. 首先给ASP.NET Web API插上OData的翅膀,通过NuGet安装OData. 然后,给control ...
- [置顶]
kubernetes资源类型--PetSets/StatefulSet
PetSet首次在K8S1.4版本中,在1.5更名为StatefulSet.除了改了名字之外,这一API对象并没有太大变化. 注意:以下内容的验证环境为CentOS7.K8S版本1.5.2,并部署Sk ...
- [置顶]
kubernetes资源类型--持久化存储Persistent Volume和Persistent Volume Claim
概念 存储管理跟计算管理是两个不同的问题.理解每个存储系统是一件复杂的事情,特别是对于普通用户来说,有时并不需要关心各种存储实现,只希望能够安全可靠地存储数据. 为了简化对存储调度,K8S对存储的供应 ...
- 手把手教你查看网站遭受到的Web应用攻击类型
常见Web应用攻击类型有:webshell.SQL注入.文件包含.CC攻击.XSS跨站脚本攻击.敏感文件访问.远程命令.恶意扫描.代码执行.恶意采集.特殊攻击.其他攻击十二种攻击类型. 如何查看网站遭 ...
随机推荐
- CentOS7设置IP地址
root权限下cd到/etc/sysconfig/network-scripts, vi ifcig-em1 TYPE=Ethernet BOOTPROTP=static NAME=em1 UUID= ...
- OpenCV(4)-图像掩码操作(卷积)--平滑处理
卷积定义 矩阵的掩码操作即对图像进行卷积.对图像卷积操作的意义为:邻近像素对(包括该像素自身)对新像素的影响:影响大小取决于卷积核对应位置值得大小. 例如:图像增强可以使用 \[ I(i,j)=5*I ...
- 选择第n小的元素之python实现源码
def partition(A, p, r): j = p+1 for i in range(p+1, r+1): if(A[i] < A[p]): tmp = A[i] A[i] = A[j] ...
- [翻译][MVC 5 + EF 6] 3:排序、过滤、分页
原文:Sorting, Filtering, and Paging with the Entity Framework in an ASP.NET MVC Application 1.添加排序: 1. ...
- uboot下 Nand flash 启动 内核与根文件系统
u-boot版本: u-boot-2010.03_tekkamanninja修改的u-boot 1.将uboot通过j-link烧写到norflash,启动后 saveenv 将参数保存到 nandf ...
- win7的IE11降到IE8
我为什么要降低IE版本呢?...... 下载了抓包工具HttpWatch,下载地址http://pan.baidu.com/s/1kVhPMmj 版本如下: 用IE11打开抓包时流内没有内容,可能跟 ...
- Spring Mvc Controller间跳转 重定向 传参 (转)
原文链接:http://zghbwjl.blog.163.com/blog/static/12033667220137795252845/ 1. 需求背景 需求:spring MVC框架con ...
- datagridview用get,set访问并加锁,可以控制所有使用datagridview的地方都顺序进行访问
public System.Windows.Forms.DataGridView dataGridView1 { get { lock (ojb) { return dataGridView; } } ...
- 自设chrome默认滚动条样式
今天无聊,想着chrome这种全面使用html的浏览器,可不可以让我自行改变它的默认CSS呢,结果去查查,有,很好 win7/8目录为 C:\Users\[你的用户名]\AppData\Local\G ...
- 文件操作 - NSFileManager
iOS的沙盒机制,应用只能访问自己应用目录下的文件.iOS不像android,没有SD卡概念,不能直接访问图像.视频等内容.iOS应用产生的内容,如图像.文件.缓存内容等都必须存储在自己的沙盒内.默认 ...