fireBug网络面板数据说明(转)

一个正常的链接点开后会基本会接收图片、js文件、css文件等，没接收这样的一个东西在下面的firefox面板都会有一条记录。每个文 件都有域名解析-链接-发送请求-等待响应-接收数据 这几个过程。这些文件可以同时下载的并不是下载好一个文件再下载另外一个，所以时间轴（从左往右）会有重合的。不过第一条记录肯定是从最左边开始也就是 +0开始。

+23ms 开始//从点开链接到第23ms时开始处理这个文件

开始处理的时间点 此阶段处理时间总计 处理事项
0 0 域名解析
0 16ms 建立连接
+16ms 0 发送请求
+16ms 344ms 等待响应 //从第16ms开始等待响应，等待了344ms接收数据
+360ms 0 接收数据   //从第360ms开始接收数据，360ms=(344ms+16ms)

+14.43s 'DOMContentLoaded'(事件)//在第14.43秒触发DOMContentLoaded事件
+17.2s 'load'(事件)//在第17.2秒触发load事件

 

 

下面是一只来自百度的工程师的回答

网络选项卡一条请求的URL包含：

1.请求类型(GET|POST)

2.请求地址(鼠标悬浮在URL列上时会完整显示)

3.状态及其描述(200 ok)

4.所属域名

5.资源大小

6.图形化的时间线

firebug的时间线以瀑布图的形式展现，很直观，而当你把鼠标悬浮在时间线上的时候，就会弹出该条时间线的详情的tips，这个tips包含5个阶段和2个事件：
* DNS Lookup：DNS查询时间
* Connection：创建一个TCP链接花掉的时间
* sending：向服务器发送请求需要的时间
* Waiting ：等待服务器响应
* Receiving：从服务器获取文件消耗的时间
* DOMContentLoaded： 事件，DOMContentLoaded事件完成的时间
* Load：事件，页面load事件完成的时间

有了这些信息，我们就能初步诊断网站的性能瓶颈。

1）首先看一下哪个请求花费的时间比较长，看看这个请求的时间线信息，确定是服务器响应慢了还是网络的问题。

2）如果每个请求所花费的时间都没有明显高于其他，那么就看一下是不是页面的Http请求总数太多了。因为浏览器对单个域名的并发连接数是有限制 的，需要处理完一批请求再发送另一批请求。假设页面有100个请求，每个请求花费1s，浏览器最大并发数限制为10个，那么处理完所为请求就需要 100/10*1s=10s的时间。

关于最大并发数，Http1.1的标准是2，而目前主流的浏览器IE、FireFox、Chrome为了提高速度，分别修改为10、6、6（根据具体版本可能有所变化）。

 【总结】上述观点综合下，能够更好地了解FIREBUG的时间轴