获取跨域脚本标签的HTML5性能对象

Question

I'm wondering, as there are domainLookupStart and domainLookupEnd attributes in the window.performance object in modern browsers, is there any way to know the domain lookup time of scripts that are hosted on third-party sites ? or is this time already included in the given domainLookupStart and domainLookupEnd ?

Answer 1

You can use the Resource Timing API .

To log the DNS lookup time for all resources in the current document:

var resourceTimings = performance.getEntriesByType('resource');
  resourceTimings.forEach(function(resource) {
  console.log(resource.name + ' ' + (resource.domainLookupEnd - resource.domainLookupStart));
})

To get all stats for a single named resource:

var jQueryTiming = performance.getEntriesByName("http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js")

Example result:

[
  {
    "responseEnd": 436.0980000055861,
    "responseStart": 434.55200002063066,
    "requestStart": 332.36200001556426,
    "secureConnectionStart": 0,
    "connectEnd": 332.30700000422075,
    "connectStart": 332.18300002045,
    "domainLookupEnd": 332.18300002045,
    "domainLookupStart": 320.040999999037,
    "fetchStart": 316.93600001744926,
    "redirectEnd": 0,
    "redirectStart": 0,
    "initiatorType": "script",
    "duration": 119.16199998813681,
    "startTime": 316.93600001744926,
    "entryType": "resource",
    "name": "http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"
  }
]

Recommended reading: http://www.sitepoint.com/introduction-resource-timing-api/

Current browser compatibility: http://caniuse.com/#feat=resource-timing