Firefox网络面板中的彩条代表什么？

Question

在firefox开发人员工具中，在“Net”面板下，加载的资源将其加载时间拆分为不同的颜色/类别。这些是：

• DNS查询
• 连接
• 禁止
• 发送
• 等待
• 接收

每个代表什么，更具体地说，它们中的任何一个是否准确地代表了服务器思考的时间（访问数据库，运行算法等）？

感谢。

Answer 1

我无法准确确定服务器正在做什么，我担心。

但是，除了等待之外，您可以对其中的大部分进行折扣，因为其余部分在服务器处理您的请求之前和之后发生。等待时它实际上做的是一个“黑匣子”。

在发送和接收过程中可能会发生一些异步操作，因此很难准确，但您可以获得服务器工作时间和请求花费来回的时间。

修改

粗略定义：

DNS查找：使用DNS服务器将Web地址转换为目标IP地址 连接：建立与Web服务器的连接

阻止：以前称为“排队”，会对此进行更详细的解释here

发送：将HTTP请求发送到服务器

等待：等待来自服务器的响应 - 这是它可能正在完成所有工作的地方

接收：从服务器获取HTTP响应

Answer 2

firebug wiki也解释了这些（请参阅时间轴部分）。

• 阻止在浏览器队列中等待网络所花费的时间 连接（以前称为排队）。对于SSL连接，这包括SSL握手和OCSP验证步骤。
• DNS查询 DNS解析时间
• 连接创建TCP连接所需的已用时间
• 正在等待等待来自服务器的回复
• 接收从服务器读取整个响应所需的时间 （和/或从缓存中读取所需的时间）
• 'DOMContentLoaded'（事件）触发DOMContentLoaded事件的时间点（自请求开始以来，如果请求已被删除，则可能为否定 事件发生后开始）
• 'load'（事件）触发页面加载事件的时间点（自请求开始以来，如果在事件发生后请求已启动，则可能为负）

Answer 3

有一篇非常好的文章，其中包含时间图表和协议级别对每个阶段here发生的事情的解释。我发现它非常有用，因为它们还可以直观地展示使用持久和并行连接与串行连接的影响。