| |
|
开发:
C++知识库
Java知识库
JavaScript
Python
PHP知识库
人工智能
区块链
大数据
移动开发
嵌入式
开发工具
数据结构与算法
开发测试
游戏开发
网络协议
系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程 数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁 |
-> 网络协议 -> window.performance -> 正文阅读 |
|
[网络协议]window.performance |
window.performance performance是W3C基于前端对性能的需求下推出的一套性能API标准。 用户输入URL到用户使用页面全过程时间统计,会返回一个PerformanceTiming对象,单位为毫秒 1. 几个关键的点: (1)fetchStart:发起获取当前文档的时间,我理解是浏览器收到页面发起请求的时间点。 (2)domainLookupStart:返回浏览器开始DNS查询的时间,如果此请求没有DNS查询过程,如长连接,资源Cache,或是本地资源,那么就返回fetchStart的值。 (3)domainLookupEnd: 返回浏览器结束DNS查询的时间,如果没有DNS查询同上。 (4)ConnectStart: 浏览器向服务器请求文档,开始建立连接的时间,如果此连接是一个长连接或者无需和服务器连接(使用缓存),则返回domainLookupEnd的值。 (5)ConnectEnd:浏览器向服务器请求文档,建立连接成功的时间。 (6)requestStart:开始请求文档时间(注意没有requestEnd) (7)responseStart:浏览器开始接收第一个字节的时间,数据来自于服务器,缓存或本地。 (8)unloadEventStart:卸载一个文档开始的时间。 (9)unloadEventEnd:卸载一个文档结束的时间。 (10)domLoading:浏览器把domcument.readyState设置为“loading”的时间点,开始构建DOM书的时间点。 (11)responseEnd:浏览器接收最后一个字节数据的时间,连接被关闭的时间。 (12)domInterActive:浏览器把domcument.readyState设置为“interactive”的时间点,DOM树创建结束。 (13)domContentLoadedEventStart:文档发生DomContentLoaded的事件时间。 (14)domContentLoadedEventEnd:文档的DOMContentLoaded事件结束的时间。 (15)domComplete:浏览器把document.readyState设置为“complate”的时间点。 (16)loadEventStart:文档触发load事件的时间。 (17)loadEventEnd:文档触发load事件结束后的时间。 2. 常用的一些值 (1)准备新页面耗时:fetchStart-navigationStart (2)重定向时间:redirectEnd-redirctStart (3)App Cache时间:domainLookupStart-fetchStart (4)DNS解析时间:domainLookupEnd-domainLookupStart (5)TCP连接时间:connectEnd-connectStart (6)request时间:responseEnd-requestStart 请求开始到响应结束 (7)请求完毕到DOM树加载:domInterActive-responseEnd (8)构建与解析DOM树,加载资源时间:domComplete-domInteractive (9)load时间:loadEventEnd-loadEventStart (10)整个页面的加载时间:loadEventEnd-NavigationStart (11)白屏时间:responseStart-navigationStart performance.getEnteres() 这个API能帮我们获得资源的请求时间,报错JS、CSS、图片等 包含的信息: (1)entryType:类型为resource (2)name:资源的url (3)initiatorType:资源的link (4)资源时间 :duration的值,是responseEnd-startTime performance.memory 这个API主要是浏览器内存情况 包含的信息: (1)jsHeapSizeLomit:内存大小限制 (2)totalJSHeadSize:可使用的内容 (3)userdJSHeadSize:已使用的内容 |
|
网络协议 最新文章 |
使用Easyswoole 搭建简单的Websoket服务 |
常见的数据通信方式有哪些? |
Openssl 1024bit RSA算法---公私钥获取和处 |
HTTPS协议的密钥交换流程 |
《小白WEB安全入门》03. 漏洞篇 |
HttpRunner4.x 安装与使用 |
2021-07-04 |
手写RPC学习笔记 |
K8S高可用版本部署 |
mySQL计算IP地址范围 |
|
上一篇文章 下一篇文章 查看所有文章 |
|
开发:
C++知识库
Java知识库
JavaScript
Python
PHP知识库
人工智能
区块链
大数据
移动开发
嵌入式
开发工具
数据结构与算法
开发测试
游戏开发
网络协议
系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程 数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁 |
360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 | -2024/11/26 11:40:14- |
|
网站联系: qq:121756557 email:121756557@qq.com IT数码 |