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. 2017 world final

    E 解题关键:二分时注意C函数的单调性. #include<bits/stdc++.h> #define eps 1e-8 #define INF 0x3f3f3f3f using nam ...

  2. 在PCL中如何实现点云压缩(1)

    点云由庞大的数据集组成,这些数据集通过距离.颜色.法线等附加信息来描述空间三维点.此外,点云能以非常高的速率被创建出来,因此需要占用相当大的存储资源,一旦点云需要存储或者通过速率受限制的通信信道进行传 ...

  3. 9、par画图参数

    转载:http://blog.sina.com.cn/s/blog_8f5b2a2e0102v0tf.html 1. 函数par()的使用格式如下: par(..., no.readonly = FA ...

  4. JavaScript学习系列7 -- JavaScript中的运算符

    今天,我们来说一说JavaScript中的运算符,首先我们来讲一讲 一元运算符 JavaScript中的一元运算符有以下几种 1. delete delete 运算符主要用于删除对以前定义的对象属性或 ...

  5. 9.CVE-2016-5195(脏牛)内核提权漏洞分析

    漏洞描述: 漏洞编号:CVE-2016-5195 漏洞名称:脏牛(Dirty COW) 漏洞危害:低权限用户利用该漏洞技术可以在全版本Linux系统上实现本地提权 影响范围:Linux内核>=2 ...

  6. MATLAB进行无约束优化

    首先先给出三个例子引入fminbnd和fminuc函数求解无约束优化,对这些函数有个初步的了解 求f=2exp(-x)sin(x)在(0,8)上的最大.最小值. 例2 边长3m的正方形铁板,四角减去相 ...

  7. [Django笔记] models 深入学习

    对着官方文档撸一遍,顺便做点笔记 models 定义了本应用的数据库表结构.底层可以由不同的数据库封装实现,因为不同的数据库字段类型不一样,因此,跟以往直接用单一数据库(如mysql)建立的应用有很大 ...

  8. C#之数据类型转换

    前言    在C#中学习中,像在VB学习的时候一样,我们会接触到很多种数据类型,但是VB中在用数据类型的时候,我们会考虑这个数据要求多大的内存,或者说有时候为了满足很少的大内存事件,而狠心分配给它较大 ...

  9. windows severs 2008r2 180天激活

    无需破解:Windows Server 2008 R2 至少免费使用 900天 1.首先安装后,有一个180天的试用期. 2.在180天试用期即将结束时,使用下面的评估序列号激活Svr 2008 R2 ...

  10. 唯快不破:Web 应用的 13 个优化步骤

    时过境迁,Web 应用比以往任何时候都更具交互性.搞定性能可以帮助你极大地改善终端用户的体验.阅读以下的技巧并学以致用,看看哪些可以用来改善延迟,渲染时间以及整体性能吧! 更快的 Web 应用 优化 ...