一种抓取用户异步请求回调执行时间的方法技术

本发明专利技术涉及互联网监控领域，尤其涉及一种抓取用户异步请求回调执行时间的方法，用于监控网页中异步请求(Ajax)的回调函数代码执行所花费的时间，便于分析异步请求的性能。该方法是根据单线程的原理，当有异步回调函数执行的时候，立即再加入一个为零的定时器，定时器里的回调会被放在队列中，并在js主线程中空闲的时候立即被推入到主线程中执行，使得该回调函数代码执行完就会立即执行定时器里面的代码；从回调执行开始‑回调执行‑定时器执行，这几个时间在同一条线上，通过定时器的执行来标识回调的结束，并计算所要的时间。

【技术实现步骤摘要】

本专利技术涉及互联网web性能监控领域，具体涉及一种抓取用户异步请求回调执行时间的方法。
技术介绍
在本专利技术前，目前各大浏览器的升级都对性能的提升做了不断的优化，用户对体验的敏感度也越来越高，很多产品都开始注重用户的体验，出现了很多用户体验监控产品，像国外的newrelic、dynatrace,以及国内的uyun(优云)、oneapm等。作为一个前端开发者，重点关注点在Web性能上。Web的性能度量大致可分为两个部分，一部分是页面及外部资源的加载时间，另一部分则是用户与页面的交互过程中的展现时间。第一部分有很多相应的优化方案，比如cdn，csssprites；第二部分现在也有相关框架，如现在的React提出的virtualdom，就是减少在视图层面最终展现的时间。另外一方面，随着web应用的流行，单页应用也越来越多，全都是采用异步请求来更新页面，异步请求的性能也越来越需要得到重视，目前很多都是在请求这块去做监控和优化，而在抓取异步请求回调的执行时间业界并没有好的方案，虽然这个时间相对较短，但是在越来越高的用户体验上，还是有必要把这块的时间展现给用户，让用户做更进一步的分析；有鉴于此，特提出本专利技术。
技术实现思路
本专利技术的目的在于克服现有技术存在的不足，而提供一种抓取用户异步请求回调执行时间的方法，通过js单线程原理和改写元素浏览器对象来实现，用于监控网页中异步请求(Ajax)的回调函数代码执行所花费的时间，便于分析异步请求的性能。本专利技术的目的是通过如下技术方案来完成的。这种抓取用户异步请求回调执行时间的方法，该方法是根据单线程的原理，当有异步回调函数执行的时候，立即再加入一个为零的定时器，定时器里的回调会被放在队列中，并在js主线程中空闲的时候立即被推入到主线程中执行，使得该回调函数代码执行完就会立即执行定时器里面的代码；从回调执行开始-回调执行-定时器执行，这几个时间在同一条线上，通过定时器的执行来标识回调的结束，并计算所要的时间。更进一步的，该方法通过改写原生异步请求对象，用于全局监控所有的异步请求；并利用js是单线程的原理，通过打点的方式来计算时间差；具体包括如下步骤：S1重新改写window.XMLHTTPRequest相关的对象和方法；S2监控所有异步请求，在readyState状态为4时，标记一个回调函数开始时间start；S3然后在currentState＝4中添加一个setTimeout(func,0)定时器，即成功返回后添加一个setTimeout(func,0)定时器，这个func里面再添加一个回调函数结束时间end；S4计算end和start之差，两者之差就是异步请求回调函数的执行时间。本专利技术的有益效果为：本专利技术完整的输出一个异步请求的时间点：从发起请求，接受请求，执行请求的回调，对目前相对一些完善的监控体验添加了最后一道监控指标，让开发者可以清晰的了解到自己应用的性能瓶颈在哪。本专利技术的目的即是计算异步请求回调函数的执行时间，尤其在单页应用中，大部分都是采用ajax交互，能帮助管理者提升应用的性能，追求更好的体验。附图说明图1是本专利技术中异步回调从抓取到上报的过程示意图；图2是本专利技术中javascript执行模型示意图。图3是本专利技术中具体流程示意图。具体实施方式下面通过附图和具体实施方式对本专利技术作进一步阐述，实施例将帮助更好地理解本专利技术，但本专利技术并不仅仅局限于下述实施例。如图所示，本专利技术主要是根据单线程的原理(同一个时刻只有一段执行代码)，当有异步回调函数执行的时候，立即加入一个为零的定时器，这个定时器里的回调会被放在队列中，并在js主线程中空闲的时候立即被推入到主线程中执行，所以保证了这个回调函数代码执行完就会立即定时器里面的代码。从回调执行开始-回调执行-定时器执行(回调结束)，这几个时间在同一条线上，通过定时器的执行来标识回调的结束，通过这样的方式计算所要的时间。本专利技术实现步骤具体如下：S1新建一个空对象用来指向原生的异步请求对象,并重新改写window.XMLHTTPRequest相关的对象和方法；S2监听异步请求回调，对不同的请求状态进行监听；S3当返回状态为成功时，在readyState状态为4时，标记下开始执行时间比如标记一个变量a；S4在状态为成功的时候立即添加一个定时器,这个定时器设为0s后执行，这个目的是尽快让这个定时器的回调立即执行(javascript主线程空闲时，会把异步队列中的回调推入到主线程去)；S5当异步请求回调中的代码执行完之后，这个时候也就是javascript主线程空闲时浏览器有个队列机制，会把这个队列里面的回调推入到主线程中去执行，也就是我们上一步的定时器回调；S6当我们的定时器回调立即执行时，我们标记一个结束时间b，从上面的步骤中可以看到，从异步回调开始执行到这个定时器执行的时间段就是异步回调执行的整个时间，所以我们用结束时间b减去开始时间a，两者之差就是异步请求回调函数的执行时间。本专利技术在实施例中，只要在web端添加应用，会生成一段部署代码，将部署代码添加到指定的页面head标签之内(这里需要对html有所了解的人去部署)，正确部署之后，过几分钟之后，web端就会有相应的数据展现。除上述实施例外，本专利技术还可以有其他实施方式。凡采用等同替换或等效变换形成的技术方案，均落在本专利技术要求的保护范围。本文档来自技高网...

【技术保护点】
一种抓取用户异步请求回调执行时间的方法，其特征在于：该方法是根据单线程的原理，当有异步回调函数执行的时候，立即再加入一个为零的定时器，定时器里的回调会被放在队列中，并在js主线程中空闲的时候立即被推入到主线程中执行，使得该回调函数代码执行完就会立即执行定时器里面的代码；从回调执行开始‑回调执行‑定时器执行，这几个时间在同一条线上，通过定时器的执行来标识回调的结束，并计算所要的时间。

【技术特征摘要】
1.一种抓取用户异步请求回调执行时间的方法，其特征在于：该方法是根据单线程的原理，当有异步回调函数执行的时候，立即再加入一个为零的定时器，定时器里的回调会被放在队列中，并在js主线程中空闲的时候立即被推入到主线程中执行，使得该回调函数代码执行完就会立即执行定时器里面的代码；从回调执行开始-回调执行-定时器执行，这几个时间在同一条线上，通过定时器的执行来标识回调的结束，并计算所要的时间。2.根据权利要求1所述的抓取用户异步请求回调执行时间的方法，其特征在于：该方法通过改写原生异步请...

【专利技术属性】
技术研发人员：刘鹏，王川林，刘东海，
申请(专利权)人：杭州优云软件有限公司，
类型：发明
国别省市：浙江;33