Page Performance Details

Overview

This custom tag captures all details regarding how the page loaded. This includes:

• DNS timing
• Domain connection timing information
• Request and response timing information
• DOM content load
• Page load timing information
• Redirection timing information (if there is a redirect)

Under Variable Summary report in ObservePoint data, select the Page Performance account to see the relevant variables.

• Connect-How-long: Shows the time in milliseconds to connect to the URL.
• Connect-Start: Shows the time in milliseconds to start the connect.
• Connect-Total: Shows the total time in milliseconds to start and connect to the URL.
• DNS-How-long: Shows the time in milliseconds for the DNS to connect.
• DNS-Start: Shows the time in milliseconds for the DNS to start to connect.
• DNS-Total: Shows the total time in milliseconds for the DNS to start and connect to the URL.
• DOM_Content-Loaded-How-long: Shows the time in milliseconds for the DOM content to load.
• DOM_Content-Loaded-Start: Shows the time in milliseconds for the DOM content to start loading.
• DOM_Content-Loaded-Total: Shows the total time in milliseconds for the DOM to start and finish loading.
• DOM_Interactive-How-long: Shows the time in milliseconds for the page subresources to load.
• DOM_Interactive-Total: Shows the time in milliseconds for the page subresources to start and finish loading.
• DOM_Loading-Start: Shows the time in milliseconds for the page subresources to start loading.
• Load_Event-How-long: Shows the time in milliseconds for an event to load on a URL.
• Load_Event-Start: Shows the time in milliseconds for an event to start loading.
• Load_Event-Total: Shows the total time in milliseconds for an event to start and finish loading.

Note: This is the metrics ObservePoint uses to calculate page load time. ☝🏼

• Redirect-How-Long: Shows the time in milliseconds for the URL to redirect.
• Redirect-Start: Shows the time in milliseconds for the URL to begin redirecting.
• Redirect-Total: Shows the total time in milliseconds for the URL to start and finish redirecting.
• Request-Start: Shows the time in milliseconds for a network request to start.
• Response-How-long: Shows the time in milliseconds for a network to respond.
• Response-Total: Shows the total time in milliseconds for a network to start and finish responding.

To capture these details in an audit or web journey, paste the snippet below into an Execute Action:

function opReqGetAsync(paramObject, acct, callback) { 
var baseURL = "https://opreq.observepoint.com/?acct=" + acct; 
var opReq = new XMLHttpRequest(); 
opReq.onreadystatechange = function() { 
if (opReq.readyState == 4 && opReq.status == 200){ 
callback(opReq.responseText); 
} 
} 
opReq.open("POST", baseURL, true); 
opReq.send(JSON.stringify(paramObject)); 
} 
var object = { 
'DNS-Start': performance.timing.domainLookupStart-performance.timing.domainLookupStart, 
'DNS-How-long': performance.timing.domainLookupEnd - performance.timing.domainLookupStart, 
'DNS-Total': performance.timing.domainLookupEnd-performance.timing.domainLookupStart, 
'Connect-Start': performance.timing.connectStart-performance.timing.domainLookupStart, 
'Connect-How-long': performance.timing.connectEnd - performance.timing.connectStart, 
'Connect-Total': performance.timing.connectEnd-performance.timing.domainLookupStart, 
'Request-Start': performance.timing.requestStart-performance.timing.domainLookupStart, 
'Response-How-long': performance.timing.responseEnd - performance.timing.requestStart, 
'Response-Total': performance.timing.responseEnd-performance.timing.domainLookupStart, 
'DOM_Loading-Start': performance.timing.domLoading-performance.timing.domainLookupStart, 
'DOM_Interactive-How-long': performance.timing.domInteractive - performance.timing.domLoading, 
'DOM_Interactive-Total': performance.timing.domInteractive-performance.timing.domainLookupStart, 
'DOM_Content-Loaded-Start': performance.timing.domContentLoadedEventStart-performance.timing.domainLookupStart, 
'DOM_Content-Loaded-How-long': performance.timing.domContentLoadedEventEnd - performance.timing.domContentLoadedEventStart, 
'DOM_Content-Loaded-Total': performance.timing.domContentLoadedEventEnd-performance.timing.domainLookupStart, 
'Load_Event-Start': performance.timing.loadEventStart-performance.timing.domainLookupStart, 
'Load_Event-How-long': performance.timing.loadEventEnd - performance.timing.loadEventStart, 
'Load_Event-Total': performance.timing.loadEventEnd-performance.timing.domainLookupStart 
} 
if(performance.timing.redirectStart && performance.timing.redirectEnd){ 
object['Redirect-Start'] = performance.timing.redirectStart; 
object['Redirect-Total'] = performance.timing.redirectEnd; 
object['Redirect-How-Long'] = performance.timing.redirectEnd - performance.timing.redirectStart; 
} else { 
var text = "There is no redirect, or one of the redirects is not of the same origin"; 
object['Redirect-Start'] = text; 
object['Redirect-Total'] = text; 
object['Redirect-How-Long'] = text; 
} 
if(performance.timing.loadEventStart && performance.timing.loadEventEnd){ 
opReqGetAsync(object,"Page Performance"); 
}