Chrome 浏览器开发者工具 Network 窗口下，可以查看下载各组件所需的具体时间。
Network 工具功能强大，能够让我看到网页加载的信息，比如加载时间，和先后顺序，是否是并行加载，还是堵塞加载。
默认情况下有八列:
（1）.Name：表示加载的文件名。
（2）.Method：表示请求的方式。
（3）.Status：表示状态码（200为请求成功，304表示从缓存读取）。
（4）.Type：表示文件的MIME Type的类型。
（5）.Initiator：表示发出这个文件请求的发出者。
（6）.Size：表示文件大小。
（7）.Time：表示每个请求的总时长。
（8）.Timeline：以图表的形式显示元素的请求和加载情况。
当然内容不仅仅先于以上8个，右击上面八个任意一个选项卡可以弹出一个菜单，可以查看更多内容:
根据上表进行简要分析——
一、Stalled（阻塞）：
浏览器得到要发出这个请求的指令，到请求可以发出的等待时间，一般是代理协商、以及等待可复用的TCP连接释放的时间，不包括DNS查询、建立TCP连接等时间等。
浏览器对同一个主机域名的并发连接数有限制，因此如果当前的连接数已经超过上限，那么其余请求就会被阻塞，等待新的可用连接；此外脚本也会阻塞其他组件的下载；
优化措施：
- 1、将资源合理分布到多台主机上，可以提高并发数，但是增加并行下载数量也会增大开销，这取决于带宽和CPU速度，过多的并行下载会降低性能；
- 2、脚本置于页面底部；
二、DNS Lookup（域名解析）：
请求某域名下的资源，浏览器需要先通过DNS解析器得到该域名服务器的IP地址。在DNS查找完成之前，浏览器不能从主机名那里下载到任何东西。
优化措施：
- 1、利用DNS缓存（设置TTL时间）；
- 2、利用 Connection:keep-alive 特性建立持久连接，可以在当前连接上进行多个请求，无需再进行域名解析；
三、Initial connection（初始化连接）:
TCP建立连接的三次握手时间
四、SSL（包含于HTTPS连接中）:
http 是超文本传输协议，以明文方式发送内容，不提供任何方式的数据加密，如果被不法分子截取浏览器和服务器之间的传输报文，会获取其中的信息。
https 是安全套接字层超文本传输协议，就是在HTTP的基础上加入了 SSL 协议，SSL 依靠证书来验证服务器的身份，并为浏览器和服务器之间的通信加密。
因此建立 HTTPS 连接的时间相当于三次握手的时间 + SSL 时间。
五、Request sent（发送请求）:
请求第一个字节发出前到最后一个字节发出后的时间，也就是上传时间。
发送HTTP请求的时间（从第一个bit到最后一个bit）。
优化措施：
- 1、减少HTTP请求，可以使用CSS Sprites、内联图片、合并脚本和样式表等；
- 2、对不常变化的组件添加长久的 Expires 头（相当于设置久远的过期时间），在后续的页面浏览中可以避免不必要的HTTP请求；
六、Waiting（等待响应）:
请求发出后，到收到响应的第一个字节所花费的时间(Time To First Byte)。
通常是耗费时间最长的。从发送请求到收到响应之间的空隙，会受到线路、服务器距离等因素的影响。
优化措施：
- 1、使用CDN，将用户的访问指向距离最近的工作正常的缓存服务器上，由缓存服务器直接响应用户请求，提高响应速度；
七、Content Download（下载）：
收到响应的第一个字节，到接受完最后一个字节的时间，就是下载时间。
下载HTTP响应的时间（包含头部和响应体）
优化措施：
- 1、通过条件Get请求，对比 If-Modified-Since 和 Last-Modified 时间，确定是否使用缓存中的组件，服务器会返回 “304 Not Modified” 状态码，减小响应的大小；
- 2、移除重复脚本，精简和压缩代码，如借助自动化构建工具grunt、gulp等；
- 3、压缩响应内容，服务器端启用gzip压缩，可以减少下载时间；
