Chrome snippet to show performance of document

detailedMetrics.js

javascript:( function() {
    console.group( 'Performance Information for all entries of ' + window.location.href );
    console.log( '\n-> Duration is displayed in ms\n ' )
    
    var entries = window.performance.getEntries();
    
    entries = entries.sort( function( a, b ) {
        return b.duration - a.duration;
    } );
    
    console.table(
        entries, [ 'name', 'duration' ]
    );
    
    console.groupEnd();
})();

metrics.js

javascript:( function() {
  console.group( 'Performance Information for ' + window.location.href );
  console.log( '\n-> Time is displayed in ms\n ' );

  var timing = window.performance.timing;
  var metrics = {
    'Time for DNS lookup' : {
      time : timing.domainLookupEnd - timing.domainLookupStart
    },

    'Time for Connecting' : {
      time : timing.connectEnd - timing.connectStart
    },

    'Time for Receiving' : {
      time : timing.responseEnd - timing.responseStart
    },

    'Time to document "DOMContentLoaded" event' :  {
      time : timing.domContentLoadedEventEnd - timing.navigationStart
    },

    'Time to document "load" event' : {
      time : timing.loadEventEnd - timing.navigationStart
    }
  };

  console.table(
    metrics, [ 'time' ]
  );

  console.groupEnd();
} )()