使用HTML5的性能和性能来测量JS性能。定义对象

时间:2014-11-25 07:29:07

标签: javascript jquery html5 performance jsperf

我根据HTML5提供的性能对象来衡量我的网站性能,我想知道我的应用程序出了什么问题,我还要记录其他最终用户的这些性能对象本地数据库,以便我从他们的方面获得信息,但我不太熟悉每个属性意味着什么,比如connectStart,connectEnd延迟的原因...我根据我的知识创建了一个地图,但我需要来自社区的投入......这对其他人来说非常有帮助

var issueList = {
    'connectStart':         'Network issue',
    'connectEnd':           'Server is not responding fast with SSL handshake',
    'domainLookupStart':    'Network issue',
    'domainLookupEnd':      'Network issue',
    'fetchStart':           'Slow browser',
    'redirectStart':        'Network issue',
    'redirectEnd':          'Busy server',
    'requestStart':         'Network issue',
    'responseStart':        'Server is slow',
    'domLoading':           'Low internet bandwidth',
    'unloadEventStart':     'Slow browser',
    'unloadEventEnd':       'Slow browser, browser processes are too heavy',
    'navigationStart':      'Slow browser',
    'responseEnd':          'Network issue',
    'domInteractive':       'Browser issue',
    'domContentLoadedEventStart':   'Network issue',
    'domContentLoadedEventEnd':     'Network issue',
    'domComplete':          'Too much DOM manipulation',
    'loadEventStart':       'Unknown',
    'loadEventEnd':         'Low JS performance, either not optimized JS or browser is slow'
};

此图像显示了该过程的顺序以供参考 Perfromance Timing Overview

我还为此

创建了JSFiddle

同样,我也想在我的网页中测量AJAX请求的性能,并且我正在考虑使用readyState的AJAX请求所以我想知道在每次状态更改之间花费时间的原因是什么

State  Description                     Reason
0      The request is not initialized  Slow JS execution
1      The request has been set up     Slow JS execution
2      The request has been sent       Slow Netowkr Connection
3      The request is in process       Slow Server response
4      The request is complete         Slow server processing
  

我想要这样做的原因是因为,有时我们得到了一个   抱怨我们的申请有点慢,所以在那些情况下   我们可以阅读该用户的性能对象,也可以阅读整体   表现对象。我们还可以阅读各种性能对象   高峰使用我们的应用程序和其他时间以及想要衡量   应用程序的哪个部分需要更长的时间来加载。在   同时它是一种随着时间的推移而发展的产品   为了将来参考,我也可以使用这些数据作为基准。所以我唯一的   重点是完全理解这个对象

此外,如果还有其他方式(如果我选择了很长的路线),请告诉我......

1 个答案:

答案 0 :(得分:3)

  

我还想在本地数据库中记录其他最终用户的这些性能对象

让我们从这个方面开始吧。你不需要自己重新发明这一切。实际上改善您的网站所花费的时间要好得多,而不是创建自己的监控解决方案。

Google Analytics实际上会为您跟踪计时对象,因此您可以在那里查看。 New Relic也是这样做的,并且更注重开发人员,也跟踪服务器端的事情。你可以选择其他100个。

  

但我不太熟悉每个财产的含义

这些的规范定义是W3C建议:https://www.w3.org/TR/navigation-timing/

  

我根据自己的知识创建了一张地图,但我需要社区的输入

我建议创建这样的地图,至少以你迄今为止定义它的方式。每个事件都意味着特定的事假设重定向与网络问题或繁忙的服务器有任何关系是没有意义的。当然,缓慢的重定向可能是由于这些项目...但它可能是由于其他100件事或甚至是有意的。还要考虑到世界各地的网络状况差异很大。简而言之,as-is的定义是最好的。

如果您对含义有特定的疑问,并且W3C规范对您来说不够清楚,我建议您询问有关您感到困惑的特定项目的具体问题。