WPO Metrics Tracker

wpo.js

(function(){
    var wpo = {
        redirects: window.performance.navigation.redirectCount,    
        resources: {
            iframe: 0,
            img: 0,
            css: 0,
            script: 0,
            beacon: 0,
            xmlhttprequest: 0,
            navigation: 0,
            link: 0,
            other: 0,
            fetch: 0
        },
        resources_size: {
            iframe: 0,
            img: 0,
            css: 0,
            script: 0,
            beacon: 0,
            xmlhttprequest: 0,
            navigation: 0,
            link: 0,
            other: 0,
            fetch: 0
        },      
        resources_by_protocol: {},
        resources_by_origin: {
            internal: 0,
            external: 0,
        },
        cookies: {
            count: document.cookie.split(';').length,
            size: document.cookie.length,
            avgCookieSize: document.cookie.length/document.cookie.split(';').length,
        },
        timings: null
    }
    if (window.performance) {
        var performance = window.performance;
        wpo.timings = window.performance.timing;
        var performanceEntries = performance.getEntries();
        performanceEntries.forEach(function(performanceEntry,i,entries){
            if(performanceEntry.entryType==="paint"){      
                if(performanceEntry.name==="first-contentful-paint" || performanceEntry.name==="first-paint"){
                    wpo.paint = wpo.paint || {};
                    wpo.paint[performanceEntry.name] = performanceEntry.startTime
                }               
            } 
          
            if (performanceEntry.initiatorType) {
                wpo.resources[performanceEntry.initiatorType] = wpo.resources[performanceEntry.initiatorType] + 1;
                wpo.resources_size[performanceEntry.initiatorType] = wpo.resources_size[performanceEntry.initiatorType] + performanceEntry.transferSize;              
            }
            if (performanceEntry.nextHopProtocol) {
                if (!wpo.resources_by_protocol[performanceEntry.nextHopProtocol]) {
                    wpo.resources_by_protocol[performanceEntry.nextHopProtocol] = 0;
                }
                wpo.resources_by_protocol[performanceEntry.nextHopProtocol]++;
            }
            if (performanceEntry.name.indexOf(document.location.origin.split('//')[1]) > -1) {
                wpo.resources_by_origin.internal++;
            } else {
                wpo.resources_by_origin.external++;
            }
        }
        );
    }

    window.dataLayer.push({
        event: 'wpo_data_ready',
        wpo_data: wpo
    });  
})();