Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
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
You can’t perform that action at this time.