博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
前端性能监控window.performance的巧妙写法
阅读量:7120 次
发布时间:2019-06-28

本文共 1320 字,大约阅读时间需要 4 分钟。

performance常规用法

相信很多人都在使用window.performance来监控页面的性能。都会在页面onload后,去获取window.performance.timing

但如果真正分析过数据的人,都会发现window.performance.timing.loadEventEnd有些时候在onload时间触发后

还是为0

这时候可能有些人会延迟再重新获取一次

这里带来另外一种思路实现

performance万无一失的用法

(function(){    if (window.performance || window.webkitPerformance) {        var perf = window.performance || window.webkitPerformance;        var timing = perf.timing;        var navi = perf.navigation;        var timer = setInterval(function() {            if (0 !== timing.loadEventEnd) {                clearInterval(timer);                var data = {                    url: window.location.href,                    ua: window.navigator.userAgent,                    dns :timing.domainLookupEnd - timing.domainLookupStart,                    tcp :timing.connectEnd - timing.connectStart,                    request : timing.responseEnd -timing.responseStart,                    blank : timing.domLoading - timing.fetchStart,                    domready : timing.domContentLoadedEventEnd - timing.fetchStart,                    onload : timing.loadEventEnd - timing.fetchStart,                    firstimagetime : 0,                    isdirty : 0                };

用了一个定时器去判断timing.loadEventEnd不等于0的时候才去上报。

这样的写法有两个好处

1 不必局限于onload方法了,可以在任何时候执行
2 保证loadEventEnd不为0,避免脏数据

好处多多...是不是要改进下上报的写法呢。

转载地址:http://jwsel.baihongyu.com/

你可能感兴趣的文章
关于BOF改进方法的一些introduction
查看>>
20165323 第一周学习总结
查看>>
第二章 例题2-11
查看>>
系统参数递归
查看>>
tomcat详细日志配置
查看>>
Docker学习笔记1
查看>>
字符编码-Unicode等
查看>>
mind map in latex
查看>>
郑捷《机器学习算法原理与编程实践》学习笔记(第四章 推荐系统原理)(三)SVD...
查看>>
log4j整理
查看>>
Oracle Tuning ( instance 级别 ) 01
查看>>
HTML 5 画布
查看>>
# 20155224 实验四 Android程序设计
查看>>
ARP 协议 理解
查看>>
Allow windows service to "Interact with desktop"
查看>>
InitGoogleLogging坑爹
查看>>
SQL 查询间隔时间大于60s的所有数据
查看>>
*ecshop 限制文章帮助文章显示条数
查看>>
使用phpStudyy运行tipask
查看>>
c# 常用函数
查看>>