Performance timing API 中文解释

最新推荐文章于 2024-10-17 20:38:09 发布
最新推荐文章于 2024-10-17 20:38:09 发布
阅读量209 收藏
点赞数
分类专栏： HTML5 Javascript WEB前端 文章标签： HTML5 performance api timing
WEB前端 同时被 3 个专栏收录
11 篇文章 0 订阅
订阅专栏
Javascript
10 篇文章 0 订阅
订阅专栏
HTML5
3 篇文章 0 订阅
订阅专栏

Performance timing API 中文解释

navigationStart
当访问一个新页面时，当前页面卸载完成所返回的时间点，如果没有当前页面，则返回fetchStart时间点。
unloadEventEnd
如果要打开的页面和当前的页面同源，则返回用户unload事件执行完成后的时间点，如果当前文档不存在或者不同源，则返回0
redirectStart
如果是HTTP重定向，如果跳转都是同源的，则返回开始获取发起重定向的时间点，否则返回0
redirectEnd
如果是同源重定向，返回重定向请求接收完最后一字节的时间点，否则返回0
fetchStart
如果请求是用http get发起的，返回浏览器查缓存之前的时间点，否则返回发起获取资源的时间点
domainLookupStart
返回浏览器发起DNS查询的时间点，如果是长连接或者请求文件来自缓存等本地存储则返回fetchStart时间点
domainLookupEnd
返回结束DNS查询的时间点，如果是长连接或者请求文件来自缓存等本地存储则返回fetchStart时间点
connectStart
返回浏览器向服务器发起建立获取当前文档的连接请求的时间点，
如果是长连接或者请求文件来自缓存等本地存储则返回domainLookupEnd时间点
connectEnd
返回与服务器建立完成连接的时间点，
如果是长连接或者请求文件来自缓存等本地存储则返回domainLookupEnd时间点
requestStart
返回浏览器发起请求的时间，不管是向server还是本地缓存或存储
responseStart
返回浏览器拿到第一个响应字节的时间点，包括从服务器、缓存或者其他本地存储
responseEnd
返回浏览器拿到最后一个响应字节或者传输连接关闭的时间点，包括从服务器、缓存或者其他本地存储
domLoading
返回浏览器将当前文档状态设置成loading的时间点
domInteractive
返回浏览器将当前文档状态设置成interactive的时间点
domContentLoadedEventStart
返回浏览器触发DOMContentLoaded事件执行之前的时间点
domContentLoadedEventEnd
返回浏览器触发DOMContentLoaded事件执行完成的时间点
domComplete
返回浏览器将当前文档状态设置成complete的时间点
loadEventStart
返回浏览器触发load事件执行之前的时间点，否则为0
loadEventEnd
返回浏览器触发load事件执行完成的时间点

参考：w3c


 

next_100
关注
专栏目录
Performance API
weixin_47450807的博客
04-04 1632
一、写在前面 Performance api用于精确度量，控制，增强浏览器的性能表现。这个API为了测量网站性能，提供以前没有办法做到的精度。 比如：为了得到脚本运行的准确时间，需要一个高精度时间戳。传统的做法是使用Date对象的getTime方法。 var start = new Date().getTime() let i = 100 while(i) { console.log('111') i-- } var now = new Date().getTime() var latency
ruby_server_timing：通过Server Timing API将Rails服务器端性能指标:chart_increasing:引入Chrome的开发人员工具。 生产安全:trade_mark:
02-04
Rails的服务器定时响应头 带来Ruby on Rails服务器端性能指标 :chart_increasing: 通过server_timing gem访问Chrome的开发者工具（以及其他支持浏览器）。 生产安全:trade_mark:。 指标是从 gem收集的。 不需要帐户。 宝石安装 将此行添加到您的应用程序的Gemfile中： gem 'server_timing' 然后执行： $ bundle 组态 需要一个最小的Scout配置文件。 server_timing gem报告由 gem收集的指标（添加为server_timing的依赖项）。 如果您没有Scout帐户，请将以下最小配置复制并粘贴到RAILS_ROOT/config
Web性能时机API「Web Performance Timing API」-crx插件
03-09
使用性能定时API从您当前的网站上绘制常见的性能计时数据。 利用Web Performance API快速查看网站的网站性能。 它适用于软件工程师和一般对Web性能感兴趣的人员。 支持语言:English (United States)
页面打开计算性能 利用performance.timing进行性能分析
lotte
07-04 4211
window.onload = function(){ setTimeout(function(){ let t = performance.timing console.log('DNS查询耗时 ：' + (t.domainLookupEnd - t.domainLookupStart).toFixed(0)) console.log('...
performance.timing
最新发布
liangshanbo1215的博客
10-17 600
是 Web 性能 API 的一部分，用于获取页面加载过程中的各个时间戳。这些时间戳可以帮助开发者分析页面加载性能，找出潜在的瓶颈。返回一个对象，该对象包含了多个属性，每个属性代表页面加载过程中的某个特定事件的时间戳。以下是一些常用的fetchStartconnectEnddomLoadingloadload。
performance-timing
lay136362687的博客
08-14 1551
performance的兼容性 performance.timing对应时间节点 performance的获取方式 window.performance performance.timing的常用监测时间 DNS解析时间： domainLookupEnd - domainLookupStart TCP建立连接时间： connectEnd - connectStart 白...
初探performance.timing API
weixin_30538029的博客
11-15 133
浏览器新提供的performance接口精确的告诉我们当访问一个网站页面时当前网页每个处理阶段的精确时间(timestamp)，以方便我们进行前端分析。 它是浏览器的直接实现，比之前在网页中用js设置Date.time或者cookie来分析网页时间上要精确很多。 以下是w3c提供的performance.timing各阶段api图 暂时的缺点： Navigation Timing...
Web Performance Timing API-crx插件
04-01
语言:English (United States) 使用性能时序API从当前网站图表中的常见性能时序数据。 快速查看网站的站点性能，利用Web性能API。 这是一般的软件工程师和对Web性能感兴趣的人。
performance-timing.js利用HTML5的navigation_timing_API_performance
09-15
performance-timing.js利用HTML5的navigation_timing_API_performance-timing
performance-bookmarklet:Performance-Bookmarklet通过Resource Timing API，Navigation Timing API和User-Timing帮助分析当前页面-按类型，域，加载时间，标记等进行的请求。 轻量级的实时WebPageTest
04-01
el.src='https://micmro.github.io/performance-bookmarklet/dist/performanceBookmarklet.min.js';el.onerror=function(){alert("Looks like the Content Security Policy directive is blocking the use of ...
w3c提供的performance.timing各阶段api图
Andy222110的博客
10-27 354
图片来源 http://www.w3.org/TR/2012/REC-navigation-timing-20121217/#sec-navigation-timing-interface 转载于:https://www.cnblogs.com/iBaozi/p/4914204.html
server-timing:收集后端指标并在响应中将其作为Server-Timing标头提供
04-25
服务器计时中间件软件包 server-timing是一个PHP中间件程序包，它将Server-Timing标头添加到您的响应中。 可以在您的网络浏览器（例如Google Chrome）中查看此信息。 有关ServerTiming响应标头的更多信息，请ServerTiming 。 该软件包会自动添加两个默认指标，但也允许您添加自定义指标。 安装 composer require fetzi/server-timing 设置 该软件包在中间件实现中自动测量两个Timing值： Bootstrap ：在应用程序引导阶段花费的时间 Request ：您的请求处理程序处理您的请求所需的总时间 为了确保所有计时都尽可能准确，将中间件添加到请求处理程序堆栈的最外面（最后一个）位置非常重要。 PSR-15中间件 要启用中间件，您只需要将Fetzi\ServerTiming\ServerTimin
server-timing-metadata:将元数据添加到服务器定时并从浏览器获取
05-17
这是一个用引导的项目。 入门 首先，运行开发服务器： npm run dev # or yarn dev 用浏览器打开以查看结果。 您可以通过修改pages/index.js来开始编辑页面。 页面在您编辑文件时自动更新。 学到更多 要了解有关Next.js的更多信息，请查看以下资源： -了解Next.js功能和API。 交互式Next.js教程。 您可以查看-欢迎您提供反馈和意见！ 立即在ZEIT上部署 部署Next.js应用程序的最简单方法是使用创建者提供的。 请查看我们的以获取更多详细信息。
Timing-Api:客户端计时
06-03
Welcome to TimingAPI 这个Project的目的是收集浏览器端Page Speed数据到后端，以便分析数据，对UI优化提供依据。 Server Side Server Side使用NodeJs进行开发，请安装NodeJs 0.10.0以上，开发依赖以下开源模块： node-restify: 这是一个Restful API框架，实现Restful风格的Server端和Client端。 [] npm install restify log4js-node: Log4系列的Nodejs实现，支持文件和邮件等多种Appender, 支持不同的Level , Category写入不同的Appender。 [] npm install log4js bn.js: 用于高精度数据计算，在生成SpanSign的时候会使用h(B)*31+hd的算法，涉及到高精度运算。 [] npm ins
JS - 利用performance.timing进行性能分析
技术共享，共同进步！
03-09 934
window.onload = function(){ setTimeout(function(){ let t = performance.timing console.log('DNS查询耗时 ：' + (t.domainLookupEnd - t.domainLookupStart).toFixed(0)) console.log('TCP链接耗时 ：' + (t.connectEnd - t.connectStart).toFixed(0))
h5中performance.timing轻松获取网页各个数据 如dom加载时间 渲染时长 加载完触发时间...
热门推荐
AI天才研究院
09-15 1万+
在控制台中输入window.performance.timing(html5的属性); 各字段的含义： · navigationStart：当前浏览器窗口的前一个网页关闭，发生unload事件时的Unix毫秒时间戳。如果没有前一个网页，则等于fetchStart属性。 · unloadEventStart：如果前一个网页与当前网页属于同...
window.performance.timing属性详解
tree_stretch的博客
03-26 1596
指文档解析完成的时刻，包括在“传统模式”下被阻塞的通过script标签加载的内容（除了使用defer或者async属性异步加载的情况）。如果已经没有任何延迟加载的事件（所有图片的加载）阻止load事件发生，浏览器窗口上表示页面还在加载的图标停止旋转，那么该时刻将会将document.readyState属性设置为"complete"，此时刻就是domComplete。如果被请求的文档来自于前一个同源（同源策略）的文档，那么该属性存储的是浏览器开始卸载前一个文档的时刻。表示同源的前一个文档卸载完成的时刻。
performance.timing各字段含义 网页从url到最终显示过程 性能优化
wgod
07-08 341
performance.timing各字段含义 网页从url到最终显示过程 性能优化
探索Web性能优化利器：`performance-timing`库
gitblog_00009的博客
04-20 277
探索Web性能优化利器：performance-timing库 去发现同类优质开源项目:https://gitcode.com/ 在前端开发中，性能是衡量用户体验的重要指标之一。为了更好地监控和优化网页加载与交互性能，我们今天要向您推荐一个开源项目——。这是一个轻量级的JavaScript库，它封装了浏览器的原生Performance API，让你更方便地获取和分析Web应用的性能数据。 项目简介...
利用HTML5 Navigation Timing API优化前端性能
资源摘要信息:"本文档介绍了performance-timing.js这个脚本文件如何利用HTML5中的navigation_timing_API来获取网页性能相关的时间数据。navigation_timing_API是HTML5的一部分，能够提供详尽的时间数据点，帮助...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值