【前端】Chrome DevTools 笔记
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 笔记的更多相关文章
- Chrome DevTools学习笔记
---恢复内容开始--- chrome和firefox的开发者工具大同小异,都非常强大.今天在博客园上看了这篇文章(http://www.cnblogs.com/Wayou/p/chrome-cons ...
- Chrome DevTools 调研笔记
1 说明 此篇文章针对Chrome DevTools常用功能进行调研分析.描述了每个功能点能实现的功能.应用场景和详细操作. 2 Elements 2.1 功能 检查和实时更新页面的HTML与C ...
- Chrome DevTools 面板全攻略
李华西,微医云服务团队前端开发工程师,喜欢瞎折腾,典型猫奴 Console 面板 此章节请打开 devtools/console/console.html 一起食用 一方面用来记录页面在执行过程中的信 ...
- 每天成长一点---WEB前端学习入门笔记
WEB前端学习入门笔记 从今天开始,本人就要学习WEB前端了. 经过老师的建议,说到他每天都会记录下来新的知识点,每天都是在围绕着这些问题来度过,很有必要每天抽出半个小时来写一个知识总结,及时对一天工 ...
- Chrome DevTools的15个使用技巧(译)
谷歌浏览器如今是Web开发者们所使用的最流行的网页浏览器.伴随每六个星期一次的发布周期和不断扩大的强大的开发功能,Chrome变成了一个必须掌握的工具.大多数前端开发者可能熟悉关于chorme的许多特 ...
- chrome调试笔记
F12启动调试 1.右键加载按钮可以清空缓存并重新加载,有时候浏览器有缓存,代码更新不会及时反映出来. 2.performance mointer实时查看performance 点击三个竖着的小点,选 ...
- Chrome DevTools – 键盘和UI快捷键参考
Chrome DevTools有几个内置的快捷键,可以节省你的日常工作的时间. 本指南提供了Chrome DevTools中每个快捷键的快速参考.虽然一些快捷方式在全局范围内可用,但其他的快捷方式用于 ...
- Chrome Devtools简介
Chrome开发工具(又称DevTools),是一套内嵌在chrome浏览器内部的web编写和调试工具.DevTools提供给web开发人员深入地访问浏览器内部和web应用的机会.DevTools可以 ...
- Chrome DevTools good good study day day up
Chrome DevTools 官方页面 https://developer.chrome.com/devtools
随机推荐
- 5.Windows应急响应:挖矿病毒
0x00 前言 随着虚拟货币的疯狂炒作,挖矿病毒已经成为不法分子利用最为频繁的攻击方式之一.病毒 传播者可以利用个人电脑或服务器进行挖矿,具体现象为电脑CPU占用率高,C盘可使用空间骤降, 电脑温度升 ...
- 关于vs2012解决方案中项目DLL文件引用问题
今天用vs2012建了项目框架,老是出现说解决方案中的项目dll文件不存在,但是我按照路径去找是可以找到这个文件的,也就是说这个文件存在的.我按照引用顺序单个编译每个项目都是成功的,就是当我编译整个解 ...
- jquery获取ASP.NET服务器端控件dropdownlist和radiobuttonlist生成客户端HTML标签后的value和text值
—.获取dropdownlist的text(ddlList为服务器端dropdownlist的ID,生成name属性等于ddlList的select标签) $("#ddlList optio ...
- Unity 2018中的图形渲染
https://mp.weixin.qq.com/s?__biz=MzU5MjQ1NTEwOA==&mid=2247490249&idx=1&sn=d86083e33d9884 ...
- Pycharm自动部署项目
Pycharm自动部署项目 大家好呀,又有几天不见各位了.断更了几天,给大家说声抱歉.清明节大家都挺忙的,有扫墓祭祖的,也有趁小长假去游玩的. 所以,在节后,更新也会照常进行,继续给大家分享本人的一些 ...
- QQ音乐MP3下载
QQ音乐MP3下载 没错本次写的内容的对象是我们熟知的QQ Music. 本篇文章涉及内容包括:Python,爬虫,json解析,request 库的使用 缘起 前几天刷B站无意中又刷到了一首神曲,“ ...
- unique key 唯一约束
#添加唯一约束mysql> alter table tb2 -> add unique key(name) ->;#删除唯一约束mysql> alter table ...
- 判断当前用户是否在某个SharePoint组内
/// <summary> /// 判断当前登录人是否在sharepoint组中 /// </summary> /// <param name="current ...
- count(1), count(*), count(col) 的区别
1.count(1)和count(*)都是统计表的总行数,两者执行结果相同.表没有主键或者唯一键索引时,两者都进行全表扫描:表上主键或者唯一键索引时,使用主键或者唯一键索引. 2.count(col) ...
- Android中常用的几种加密
1.数字摘要 是指通过算法将长数据变为短数据,通常用来标识数据的唯一性,是否被修改,常用的加密算法有md5和sha1两种,如Android的App签名也是用的这两种算法. md5具有不可逆性,也可用来 ...