1. 查看网络耗时 timeline

生命周期按照以下类别显示花费的时间:

  • Queuing
  • Stalled
  • 如果适用:DNS lookup、initial connection、SSL handshake
  • Request sent
  • Waiting (TTFB)
  • Content Download

详细解释:

  • Queuing

    如果某个请求正在排队,则指示:
    请求已被渲染引擎推迟,因为该请求的优先级被视为低于关键资源(例如脚本/样式)的优先级。 图像经常发生这种情况。
    请求已被暂停,以等待将要释放的不可用 TCP 套接字。
    请求已被暂停,因为在 HTTP 1 上,浏览器仅允许每个源拥有六个 TCP 连接。
    生成磁盘缓存条目所用的时间(通常非常迅速)

  • Stalled/Blocking

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

  • Proxy Negotiation

    与代理服务器连接协商所用的时间。

  • DNS Lookup

    执行 DNS 查询所用的时间。 页面上的每一个新域都需要完整的往返才能执行 DNS 查询。

  • Initial Connection / Connecting

    建立连接所用的时间,包括 TCP 握手/重试和协商 SSL 的时间。

  • SSL

    完成 SSL 握手所用的时间。

  • Request Sent / Sending

    发出网络请求所用的时间。 通常不到一毫秒。

  • Waiting (TTFB)

    等待初始响应所用的时间,也称为至第一字节的时间。 此时间将捕捉到服务器往返的延迟时间,以及等待服务器传送响应所用的时间。

  • Content Download / Downloading

    接收响应数据所用的时间。

【前端】Chrome DevTools 笔记的更多相关文章

  1. Chrome DevTools学习笔记

    ---恢复内容开始--- chrome和firefox的开发者工具大同小异,都非常强大.今天在博客园上看了这篇文章(http://www.cnblogs.com/Wayou/p/chrome-cons ...

  2. Chrome DevTools 调研笔记

    1  说明 此篇文章针对Chrome DevTools常用功能进行调研分析.描述了每个功能点能实现的功能.应用场景和详细操作. 2  Elements 2.1  功能 检查和实时更新页面的HTML与C ...

  3. Chrome DevTools 面板全攻略

    李华西,微医云服务团队前端开发工程师,喜欢瞎折腾,典型猫奴 Console 面板 此章节请打开 devtools/console/console.html 一起食用 一方面用来记录页面在执行过程中的信 ...

  4. 每天成长一点---WEB前端学习入门笔记

    WEB前端学习入门笔记 从今天开始,本人就要学习WEB前端了. 经过老师的建议,说到他每天都会记录下来新的知识点,每天都是在围绕着这些问题来度过,很有必要每天抽出半个小时来写一个知识总结,及时对一天工 ...

  5. Chrome DevTools的15个使用技巧(译)

    谷歌浏览器如今是Web开发者们所使用的最流行的网页浏览器.伴随每六个星期一次的发布周期和不断扩大的强大的开发功能,Chrome变成了一个必须掌握的工具.大多数前端开发者可能熟悉关于chorme的许多特 ...

  6. chrome调试笔记

    F12启动调试 1.右键加载按钮可以清空缓存并重新加载,有时候浏览器有缓存,代码更新不会及时反映出来. 2.performance mointer实时查看performance 点击三个竖着的小点,选 ...

  7. Chrome DevTools – 键盘和UI快捷键参考

    Chrome DevTools有几个内置的快捷键,可以节省你的日常工作的时间. 本指南提供了Chrome DevTools中每个快捷键的快速参考.虽然一些快捷方式在全局范围内可用,但其他的快捷方式用于 ...

  8. Chrome Devtools简介

    Chrome开发工具(又称DevTools),是一套内嵌在chrome浏览器内部的web编写和调试工具.DevTools提供给web开发人员深入地访问浏览器内部和web应用的机会.DevTools可以 ...

  9. Chrome DevTools good good study day day up

    Chrome DevTools 官方页面 https://developer.chrome.com/devtools

随机推荐

  1. java多线程无锁和工具类

    1 无锁 (1) cas (compare and swap) 设置值的时候,会比较当前值和当时拿到的值是否相同,如果相同则设值,不同则拿新值重复过程:注意,在设置值的时候,取值+比较+设值 是一条c ...

  2. 《精通Spring4.X企业应用开发实战》读后感第五章(FactoryBean)

  3. Linux网络编程组播测试代码

    Linux网络编程组播测试代码 (转载)   组播客户端代码如下: #include <sys/types.h>#include <sys/socket.h>#include ...

  4. 1.2 xss原理分析与剖析(3)

    0×01 第三方劫持 (外调J/C): 本方法是我看长短短贴代码时知晓的,这篇文章我只是把这个攻击手法整理了出来,来说明这个漏洞,这个攻击手法并不是我发现的,我也不是太清楚是谁.“第三方劫持”就是把资 ...

  5. matlab矩阵与数组

    数组运算:数与数组加减:k+/-A %k加或减A的每个元素数组乘数组: A.*B %对应元素相乘数组乘方: A.^k %A的每个元素k次方:k.^A,分别以k为底A的各元素为指数求幂值数除以数组: k ...

  6. 洛谷P1047 校门外的树

    P1047 校门外的树 题目描述 某校大门外长度为L的马路上有一排树,每两棵相邻的树之间的间隔都是1米.我们可以把马路看成一个数轴,马路的一端在数轴0的位置,另一端在L的位置:数轴上的每个整数点,即0 ...

  7. [Xcode 实际操作]四、常用控件-(2)UIButton图片按钮的使用

    目录:[Swift]Xcode实际操作 本文将演示图片按钮的使用 在项目导航区,打开视图控制器的代码文件[ViewController.swift] import UIKit class ViewCo ...

  8. Spring MVC 简述:从MVC框架普遍关注的问题说起

    任何一个完备的MVC框架都需要解决Web开发过程中的一些共性的问题,比如请求的收集与分发.数据前后台流转与转换,当前最流行的SpringMVC和Struts2也不例外.本文首先概述MVC模式的分层思想 ...

  9. [JLOI2012]树 倍增优化

    题目描述 在这个问题中,给定一个值S和一棵树.在树的每个节点有一个正整数,问有多少条路径的节点总和达到S.路径中节点的深度必须是升序的.假设节点1是根节点,根的深度是0,它的儿子节点的深度为1.路径不 ...

  10. 洛谷P2184 贪婪大陆

    题目背景 面对蚂蚁们的疯狂进攻,小FF的\(Tower\) \(defence\)宣告失败--人类被蚂蚁们逼到了\(Greed\) \(Island\)上的一个海湾.现在,小FF的后方是一望无际的大海 ...