title: 网页慢！谁的锅？ tags:

• chrome
• 资源耗时
• stalled categories: 工作日志 date: 2017-12-21 10:10:38

背景

出于对google的尊重，许多面试官都喜欢问这样的问题。从你在浏览器键入 到页面最终渲染出来 期间究竟发生了什么？

当然现在也不会有问google这样的问题了，毕竟国内不可达！可以参考

分析这个问题可以有多方面：

1. dns
2. browser
3. nginx
4. tomcat
5. sql
6. js
7. 其他方面

分析

1. 作为后端工程师 通常都可以根据后端日志来定位具体请求快慢 一般来说我们查看nginx日志

   nginx可以记录两个时间 分别是request_time 和 upstream_response_time
   1. request_time 一般是指用户发请求过来到请求结束的时间

      request processing time in seconds with a milliseconds resolution (1.3.9, 1.2.6); time elapsed since the first bytes were read from the client.

   2. upstream_response_time 通常认为是后端把请求返回给nginx的时间 因此我们可以粗略的根据upstream_response_time来过滤后端慢的请求

      keeps time spent on receiving the response from the upstream server; the time is kept in seconds with millisecond resolution. Times of several responses are separated by commas and colons like addresses in the  variable.

      如果request_time>>>upstream_response_time 我们可以认为是用户网络存在问题

2. 由于后端是不直接面对用户的 用户的感知才是最重要的。那么事实上即使我们的请求全部到了用户面前 但是如果页面没渲染出来 用户仍然会认为这个慢

   我们可以考虑如下 用户在键入一个请求的时候究竟是会发生哪些事情 

3. 对于sql慢系统通常会有一些直观的提示，整体的系统慢 包括但不限于 zabbix报错 超时邮件等

4. dns导致的慢可以考虑查看chrome的NetWork面板对应的timing tab  查看dns lookup

5. 当部分区域的用户上报页面慢 可以考虑可否当地网络异常。除了查看百度之外也可以根据 相关查看

   1. 比如qq的情况如下 

   2. 比如我们的情况如下 

6. 浏览器行为导致的慢大概是后端最难监控到的

   目前只能到终端尝试 比如查看对应的timing 标签
   其中有两个需要解释的参数
   Queuing如果某个请求正在排队，则指示：
   • 请求已被渲染引擎推迟，因为该请求的优先级被视为低于关键资源（例如脚本/样式）的优先级。 图像经常发生这种情况。
   • 请求已被暂停，以等待将要释放的不可用 TCP 套接字。
   • 请求已被暂停，因为在 HTTP 1 上，浏览器仅允许每个源拥有。
   • 生成磁盘缓存条目所用的时间（通常非常迅速）

   ** Stalled/Blocking**请求等待发送所用的时间。 可以是等待 Queueing 中介绍的任何一个原因。 此外，此时间包含代理协商所用的任何时间。