- 浏览: 7851477 次
- 性别:
- 来自: 广州
文章分类
- 全部博客 (2425)
- 软件工程 (75)
- JAVA相关 (662)
- ajax/web相关 (351)
- 数据库相关/oracle (218)
- PHP (147)
- UNIX/LINUX/FREEBSD/solaris (118)
- 音乐探讨 (1)
- 闲话 (11)
- 网络安全等 (21)
- .NET (153)
- ROR和GOG (10)
- [网站分类]4.其他技术区 (181)
- 算法等 (7)
- [随笔分类]SOA (8)
- 收藏区 (71)
- 金融证券 (4)
- [网站分类]5.企业信息化 (3)
- c&c++学习 (1)
- 读书区 (11)
- 其它 (10)
- 收藏夹 (1)
- 设计模式 (1)
- FLEX (14)
- Android (98)
- 软件工程心理学系列 (4)
- HTML5 (6)
- C/C++ (0)
- 数据结构 (0)
- 书评 (3)
- python (17)
- NOSQL (10)
- MYSQL (85)
- java之各类测试 (18)
- nodejs (1)
- JAVA (1)
- neo4j (3)
- VUE (4)
- docker相关 (1)
最新评论
-
xiaobadi:
jacky~~~~~~~~~
推荐两个不错的mybatis GUI生成工具 -
masuweng:
(转)JAVA获得机器码的实现 -
albert0707:
有些扩展名为null
java 7中可以判断文件的contenttype了 -
albert0707:
非常感谢!!!!!!!!!
java 7中可以判断文件的contenttype了 -
zhangle:
https://zhuban.me竹板共享 - 高效便捷的文档 ...
一个不错的网络白板工具
http://www.alloyteam.com/2012/11/performance-api-monitoring-page-performance/
对于前端开发来说,知道整个页面从开始加载到有内容展示出来的时间是很重要的事情.
通常我们要知道页面加载的时间的话.是采用计算几个关键的时间点的方法来得出页面加载的时间.但是这个方式存在一些问题,比如:我们不知道浏览器在开始解析页面之前卸载前一个文档,解析dns的时间.
那么performance API是啥,能做啥和不能做啥呢?
首先,performance这货素html5 的草案,目前ie9,chrome11+,firefox&+已经提供了支持,用来提供浏览器级别的监控数据,可以在猛戳这里查看文档http://w3c-test.org/webperf/specs/NavigationTiming/. 其次,他只能对和当前的html文档做检测,而不能检查html中资源的情况.
这个API主要包括如下2个接口
PerformanceNavigation 主要反应用户访问页面的形式和关于访问重定向的一些相关信息
PerformanceTiming 文档解析各个步骤的耗时. 这个是我们在测试页面性能的时候需要用的东东,先上个timing的图.
[img]
http://w3c-test.org/webperf/specs/NavigationTiming/timing-overview.png
[/img]
具体的含义:
.navigationStart 准备加载页面的起始时间
.unloadEventStart 如果前一个文档和当前文档同源,返回前一个文档开始unload的时间
.unloadEventEnd 如果前一个文档和当前文档同源,返回前一个文档开始unload结束的时间
.redirectStart 如果有重定向,这里是重定向开始的时间.
.redirectEnd 如果有重定向,这里是重定向结束的时间.
.fetchStart 开始检查缓存或开始获取资源的时间
.domainLookupStart 开始进行dns查询的时间
.domainLookupEnd dns查询结束的时间
.connectStart 开始建立连接请求资源的时间
.connectEnd 建立连接成功的时间.
.secureConnectionStart 如果是https请求.返回ssl握手的时间
.requestStart 开始请求文档时间(包括从服务器,本地缓存请求)
.responseStart 接收到第一个字节的时间
.responseEnd 接收到最后一个字节的时间.
.domLoading ‘current document readiness’ 设置为 loading的时间 (这个时候还木有开始解析文档)
.domInteractive 文档解析结束的时间
.domContentLoadedEventStart DOMContentLoaded事件开始的时间
.domContentLoadedEventEnd DOMContentLoaded事件结束的时间
.domComplete current document readiness被设置 complete的时间
.loadEventStart 触发onload事件的时间
.loadEventEnd onload事件结束的时间
通过计算这些时间消耗,我们能得出页面是在文档解析的时候消耗的时间很多还是的等等连接的时候消耗的时间多.
这个接口还有啥缺陷?
暂时还木有真正开始解析dom文档的时间,不过这个ie9,有个私有属性 msFirstPaint chrome下则是chrome.loadTimes().firstPaintTime
对于前端开发来说,知道整个页面从开始加载到有内容展示出来的时间是很重要的事情.
通常我们要知道页面加载的时间的话.是采用计算几个关键的时间点的方法来得出页面加载的时间.但是这个方式存在一些问题,比如:我们不知道浏览器在开始解析页面之前卸载前一个文档,解析dns的时间.
那么performance API是啥,能做啥和不能做啥呢?
首先,performance这货素html5 的草案,目前ie9,chrome11+,firefox&+已经提供了支持,用来提供浏览器级别的监控数据,可以在猛戳这里查看文档http://w3c-test.org/webperf/specs/NavigationTiming/. 其次,他只能对和当前的html文档做检测,而不能检查html中资源的情况.
这个API主要包括如下2个接口
PerformanceNavigation 主要反应用户访问页面的形式和关于访问重定向的一些相关信息
PerformanceTiming 文档解析各个步骤的耗时. 这个是我们在测试页面性能的时候需要用的东东,先上个timing的图.
[img]
http://w3c-test.org/webperf/specs/NavigationTiming/timing-overview.png
[/img]
具体的含义:
.navigationStart 准备加载页面的起始时间
.unloadEventStart 如果前一个文档和当前文档同源,返回前一个文档开始unload的时间
.unloadEventEnd 如果前一个文档和当前文档同源,返回前一个文档开始unload结束的时间
.redirectStart 如果有重定向,这里是重定向开始的时间.
.redirectEnd 如果有重定向,这里是重定向结束的时间.
.fetchStart 开始检查缓存或开始获取资源的时间
.domainLookupStart 开始进行dns查询的时间
.domainLookupEnd dns查询结束的时间
.connectStart 开始建立连接请求资源的时间
.connectEnd 建立连接成功的时间.
.secureConnectionStart 如果是https请求.返回ssl握手的时间
.requestStart 开始请求文档时间(包括从服务器,本地缓存请求)
.responseStart 接收到第一个字节的时间
.responseEnd 接收到最后一个字节的时间.
.domLoading ‘current document readiness’ 设置为 loading的时间 (这个时候还木有开始解析文档)
.domInteractive 文档解析结束的时间
.domContentLoadedEventStart DOMContentLoaded事件开始的时间
.domContentLoadedEventEnd DOMContentLoaded事件结束的时间
.domComplete current document readiness被设置 complete的时间
.loadEventStart 触发onload事件的时间
.loadEventEnd onload事件结束的时间
通过计算这些时间消耗,我们能得出页面是在文档解析的时候消耗的时间很多还是的等等连接的时候消耗的时间多.
这个接口还有啥缺陷?
暂时还木有真正开始解析dom文档的时间,不过这个ie9,有个私有属性 msFirstPaint chrome下则是chrome.loadTimes().firstPaintTime
发表评论
-
微信开发工具中时间问题的小坑
2018-02-07 19:07 753刚开始用微信小程序开发工具,每次运行任何应用,都报这个错误: ... -
三篇不错的介绍CSS GRID的文章
2017-12-06 09:08 479三篇不错的介绍CSS GRID的文章: http://www. ... -
双因素认证(2FA)教程
2017-11-03 09:16 1461http://www.ruanyifeng.com/blog/ ... -
es6 中的export
2017-08-20 08:00 768https://juejin.im/post/5998625f ... -
markdown中的空格
2017-08-20 07:53 1648即使手动输入空格, 也是很不推荐的方法。我推荐全角空格,切换 ... -
(转)讲真,别再使用JWT了
2017-08-17 23:21 955不错的好文: http://insights.thoughtw ... -
(转)手把手教你WebStorm+chrome实现时时调试刷新
2017-08-15 10:50 2973参考: http://jingyan.baidu.com/ar ... -
IntelliJ Idea 2017 免费激活方法
2017-08-15 09:38 92601. 到网站 http://idea.lanyus.com/ ... -
前端框架这么多,该何去何从?
2017-08-04 07:17 597http://insights.thoughtworkers. ... -
记录一个HTML 5画拓扑图的商业公司
2017-07-18 19:56 805http://qunee.com/ DEMO:http:// ... -
vue 2例子学习收集
2017-07-16 11:46 9501 vue2.0手撸闲鱼App https://githu ... -
(收藏)虚拟DOM内部是如何工作的
2017-07-13 22:08 545虚拟DOM内部是如何工作的 https://segmentfa ... -
最近看到的几篇精彩JAVASCRIPT博客文章推荐
2017-07-11 07:10 520【深度长文】JavaScript数组所有API全解密 http ... -
jsonp 跨域原理:深入浅出 jsonp
2017-07-10 19:55 1383https://lzw.me/a/jsonp.html jso ... -
(转)深度长文-JavaScript数组所有API全解密
2017-07-08 19:59 773深度长文-JavaScript数组所有API全解密 http: ... -
(收藏)网页导出PDF的方案
2017-07-06 07:13 906(收藏)网页导出PDF的方案 https://yiqiwuli ... -
Chromium 新的弹窗机制以及 HTML 的 <dialog> 元素
2017-06-28 12:37 1107https://juejin.im/post/59525195 ... -
国内一个不错的大屏UI设计厂家
2017-06-03 19:43 3117http://www.lanlanwork.com/dp.ph ... -
canvas仿芝麻信用分仪表盘
2017-05-28 20:21 1521canvas仿芝麻信用分仪表盘 https://segment ... -
(转)CSS 变量教程
2017-05-10 21:12 522http://www.ruanyifeng.com/blog/ ...
相关推荐
可能是类似[“雅虎军规”](https://developer.yahoo.com/performance/rules.html?guccounter=1)和[《高性能 JavaScript》](https://book.douban.com/subject/5362856/)这样历久弥香的经典之作,也可能是搜索引擎聚合...
使用Performance_Monitor记录进程性能
FLASH演示文档,具体详细 讲解如何使用Performance Explorer分析System i的性能问题
本专题讲座将介绍如何使用量度扩展 (Metric Extension) 来诊断性能问题。量度扩展是 Oracle Enterprise Manager Cloud Control 12c 的一个新特性,具有丰富的功能,如多关键量度、设计和部署生命周期以及稳定可靠的...
描述如何使用Rational Performance Tester进行性能测试
slack的网站性能报告使用performance.timing
Performance:客户端性能工具
谷歌开发者工具性能分析文件,博客《利用chromeDevTools的Performance面板进行性能分析调优》配套文件。帮助你更好的学习使用谷歌开发者工具。
优化Flash性能 Optimizing Flash performance
页面性能监控sdk 浏览器兼容性 请参考: 优势 浏览器原生支持,准确性高 能够获取到更多的数据,例如DNS解析时间、重定向时间、白屏时间、首屏时间等 支持页面首次渲染时间的采集 可定制化程度高 支持在网页加载完成...
high performance mysql 4th edition PDF download
page-performance page-performance, performance optimization 性能分析,包含图片消耗时间,当前页面内存使用,页面加载各个时间段消耗的时间
使用性能定时API从您当前的网站上绘制常见的性能计时数据。 利用Web Performance API快速查看网站的网站性能。 它适用于软件工程师和一般对Web性能感兴趣的人员。 支持语言:English (United States)
Oracle 11gR2 Performance Tuning 性能优化 参考手册
10.PerformanceTesting(testingexperience):(性能测试(测试经验)).pdf
xunit-performance, 通过xUnit提供扩展来编写性能测试 xunit.performance 生成状态释放 调试 通过xUnit提供扩展来编写性能测试。作者基准创建新的类库项目添加对最新的 xunit.performance.api.dll 文档的引用。
FastAPI is a modern, fast (high-performance), web framework for building APIs with Python 3.6+ based on standard Python type hints.
Java性能的优化。通过对java代码优化来提升整体性能,适合于初学者还有一定java基础的人。 java performance
SQLServer 性能仪表盘(Performance Dashboard Reports)
BPF Performance Tools: Linux and Application Observability:源代码参加https://github.com/brendangregg/bpf-perf-tools-book