Generic Performance Metrics for TMS-based Web Analytics Tracking Implementations

performance_metrics.js

/* 1. Metrics to monitor the general page loading performance. I call them "poor man's page performance metrics", 
because they are the minimum you should do in terms of page performance measurement in your Analytics:

a) Time from starting to navigate to page until Server Response time: 
While this does not represent perfectly if the server does its job, it is a good enough proxy 
to "how long did the user see nothing" after clicking to the page and usually does indicate server response issues.

b) Time until DOM became interactive: A close equivalent to the good old "DOM Ready" event. 
It shows the time when the document has been fully parsed, so that still happens before your hopefully async TMS library is loaded.

The metrics are without the fluff of things like Core Web Vitals, they also don't take into account 
page rendering time (which is better handled in the Required Tasks Queue because here you eventually 
need to stop waiting if the page is still rendering when your TMS wants to fire the first Pageview). 
But these metrics still are useful at helping to identify poorly performing pages. 
They are easy to gather via the PerformanceNavigationTiming API:
*/ 
var navigationStartToServerResponseEnd = 0, navigationStartToDomInteractive = 0;
try { // to not break in older browsers if they don't support the performance APIs
    var performanceEntries = performance.getEntriesByType("navigation")[0];
    navigationStartToServerResponseEnd = Math.round(performanceEntries.responseEnd); // absolute time in ms from navigation start until the server response was received
    navigationStartToDomInteractive = Math.round(performanceEntries.domInteractive); // absolute time in ms from navigation start until the DOM was interactive
} catch (e) {
}

/* 2. Metrics that monitor your TMS's loading and execution performance. 
I only mention the most important one here: Time since the page began loading until your TMS was ready to do anything. 
For me, this is a MUST-HAVE for any tracking setup. If developers change how they load your TMS, 
this metric will drop or rise immediately. The sooner your TMS is loaded, 
the less likely you are missing out on people clicking to the next page too soon. 
Since the PerformanceNavigationTiming API does not support Epoch timestamps, we need to use the
deprecated performance.timing API for this:
In ideally the first Pre-Loader Extension / Adobe Launch Top of Page Rule / GTM init-triggered Tag, run: 
*/
var domInteractiveToTMSReady = Date.now() - window.performance.timing.domInteractive;

/* Then transfer that value into a Data Layer variable and from there to your 
Analytics Custom Metric, e.g. an Adobe Analytics "Success Event". */