Example of using the W3C Resource Timing API to display the resource timing information of +1 buttons. This code can be pasted into the Javascript console in Chrome on any page.
(function() { | |
// request PerformanceResourceTiming info for all resources on the page | |
var resources = window.performance.getEntriesByType('resource'); | |
// filter all resources to just +1 button iframes with timing information | |
var p1Resources = resources.filter(function(rtInfo) { | |
return rtInfo.name.indexOf('_/+1/fastbutton') != -1 && | |
rtInfo.responseStart != 0; | |
}); | |
// describes the timing information for a resource | |
var rtReport = function(rtInfo) { | |
var preRequestTime = Math.round(rtInfo.requestStart - rtInfo.startTime); | |
var requestTime = Math.round(rtInfo.responseStart - rtInfo.requestStart); | |
var responseTime = Math.round(rtInfo.responseEnd - rtInfo.responseStart); | |
var duration = Math.round(rtInfo.duration); | |
return 'Pre-Request Time: ' + preRequestTime + 'ms\n' + | |
'Request Time: ' + requestTime + 'ms\n' + | |
'Response Time: ' + responseTime + 'ms\n' + | |
'Total Duration: ' + duration + 'ms\n'; | |
}; | |
// report the timing for the first +1 button in the list, if one exists | |
if (p1Resources.length > 0) { | |
alert('First +1 button timing information:\n\n' + rtReport(p1Resources[0])); | |
} else { | |
alert('no widgets with resource timing information found'); | |
} | |
})(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment