有没有办法调试为什么 chrome 请求被排队?
Is there a way to debug why a chrome request was queued?
背景:Chrome有一个请求队列。在某些情况下,它将对可延迟的请求进行排队。但我发现很难确定哪些请求导致请求排队。
我的问题是:我们是否有办法深入了解排队问题的根本原因?
Chrome 可能是 queuing a request(与任何其他浏览器一样)有几个原因
Queueing. The browser queues requests when:
- There are higher priority requests.
- There are already six TCP connections open for this origin, which is the limit. Applies to HTTP/1.0 and HTTP/1.1 only.
- The browser is briefly allocating space in the disk cache
从开发者工具的网络选项卡中,使用 Save all as HAR with content
保存请求并分析每个请求的 timings
对象
"timings": {
"blocked": 2.0329999979403803,
"dns": -1,
"ssl": -1,
"connect": -1,
"send": 0.397,
"wait": 189.6199999998943,
"receive": 296.10200000024633,
"_blocked_queueing": 1.1759999979403801
}
HAR 可以用 jq
过滤,例如查找 _blocked_queueing > 50
的条目
jq -r '.log.entries | to_entries[] | if(.value.timings._blocked_queueing > 50) then [.key, .value.request.url, .value.timings._blocked_queueing,.value.timings.blocked ] else empty end' whosebug.com.har
结果:
[
21,
"https://graph.facebook.com/4191055284264423/picture?type=large",
160.28299999743467,
160.66799999743466
]
[
66,
"https://fonts.gstatic.com/s/robotoslab/v13/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjojISmb2Rm.ttf",
55.99899999651825,
109.53999999651825
]
[
67,
"https://fonts.gstatic.com/s/robotoslab/v13/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjoa4Omb2Rm.ttf",
56.85599999560509,
56.85599999560509
]
然后我们可以检查其中一个请求的前 6 个条目
jq -r --argjson idx 67 '.log.entries[($idx - 6):($idx + 1)] | .[] | [.request.url, .time, .timings]' whosebug.com.har
或获得最高dns
jq -r '.log.entries | sort_by(.timings.dns|floor)[-1] | .timings.dns, .request.url' whosebug.com.har
438.551
https://example.com
使用 Wireshark 的 TTFB 计时,这可以作为调试工作的补充。
Google 提供了一个 online HAR Analyzer 可以类似于开发工具网络面板使用。
将鼠标悬停在 Waterfall
列的请求上,可以看到请求的详细信息。作为第一种方法,排长队的请求之前可以有一个或多个对任何项目具有高价值的请求。
使用下面的命令行获取csv,然后用
制作图表
- 日期作为 Unix 时间戳 [毫秒]
- 请求时间[毫秒]
- _blocked_queueing[毫秒]
jq -r '.log.entries | to_entries[] | [.value.startedDateTime, .value.serverIPAddress, .key, ((.value.startedDateTime[0:19] + "Z"|fromdateiso8601)*1000 + (.value.startedDateTime[20:23]|tonumber)), .value.time, .value.timings._blocked_queueing ] | @csv' whosebug.com.har | tee whosebug.com.har.csv
背景:Chrome有一个请求队列。在某些情况下,它将对可延迟的请求进行排队。但我发现很难确定哪些请求导致请求排队。
我的问题是:我们是否有办法深入了解排队问题的根本原因?
Chrome 可能是 queuing a request(与任何其他浏览器一样)有几个原因
Queueing. The browser queues requests when:
- There are higher priority requests.
- There are already six TCP connections open for this origin, which is the limit. Applies to HTTP/1.0 and HTTP/1.1 only.
- The browser is briefly allocating space in the disk cache
从开发者工具的网络选项卡中,使用 Save all as HAR with content
保存请求并分析每个请求的 timings
对象
"timings": {
"blocked": 2.0329999979403803,
"dns": -1,
"ssl": -1,
"connect": -1,
"send": 0.397,
"wait": 189.6199999998943,
"receive": 296.10200000024633,
"_blocked_queueing": 1.1759999979403801
}
HAR 可以用 jq
过滤,例如查找 _blocked_queueing > 50
jq -r '.log.entries | to_entries[] | if(.value.timings._blocked_queueing > 50) then [.key, .value.request.url, .value.timings._blocked_queueing,.value.timings.blocked ] else empty end' whosebug.com.har
结果:
[
21,
"https://graph.facebook.com/4191055284264423/picture?type=large",
160.28299999743467,
160.66799999743466
]
[
66,
"https://fonts.gstatic.com/s/robotoslab/v13/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjojISmb2Rm.ttf",
55.99899999651825,
109.53999999651825
]
[
67,
"https://fonts.gstatic.com/s/robotoslab/v13/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjoa4Omb2Rm.ttf",
56.85599999560509,
56.85599999560509
]
然后我们可以检查其中一个请求的前 6 个条目
jq -r --argjson idx 67 '.log.entries[($idx - 6):($idx + 1)] | .[] | [.request.url, .time, .timings]' whosebug.com.har
或获得最高dns
jq -r '.log.entries | sort_by(.timings.dns|floor)[-1] | .timings.dns, .request.url' whosebug.com.har
438.551
https://example.com
Google 提供了一个 online HAR Analyzer 可以类似于开发工具网络面板使用。
将鼠标悬停在 Waterfall
列的请求上,可以看到请求的详细信息。作为第一种方法,排长队的请求之前可以有一个或多个对任何项目具有高价值的请求。
使用下面的命令行获取csv,然后用
制作图表- 日期作为 Unix 时间戳 [毫秒]
- 请求时间[毫秒]
- _blocked_queueing[毫秒]
jq -r '.log.entries | to_entries[] | [.value.startedDateTime, .value.serverIPAddress, .key, ((.value.startedDateTime[0:19] + "Z"|fromdateiso8601)*1000 + (.value.startedDateTime[20:23]|tonumber)), .value.time, .value.timings._blocked_queueing ] | @csv' whosebug.com.har | tee whosebug.com.har.csv