GTM Load Performance

gtm_load_performance.js

(function() {
  const targetScript = "gtm.js";

  function fmt(ms) { return ms.toFixed(2) + "ms"; }

  // Poll performance entries until we find GTM.js
  const checkInterval = 50; // ms
  const maxAttempts = 100; // ~5 seconds max
  let attempts = 0;

  const pollGTM = setInterval(() => {
    attempts++;
    const entries = performance.getEntriesByType("resource").filter(e =>
      e.name.includes(targetScript)
    );

    if (entries.length > 0) {
      clearInterval(pollGTM);
      const entry = entries[0];

      const navStart = performance.timing.navigationStart;
      const domReady = performance.timing.domContentLoadedEventStart - navStart;
      const windowLoad = performance.timing.loadEventStart - navStart;

      const dnsTime = entry.domainLookupEnd - entry.domainLookupStart;
      const tcpTime = entry.connectEnd - entry.connectStart;
      const ttfb = entry.responseStart - entry.requestStart;
      const downloadTime = entry.responseEnd - entry.responseStart;

      const loadedBeforeDOM = entry.responseEnd < domReady;
      const loadedBeforeWindow = entry.responseEnd < windowLoad;

      console.group(`GTM.js Performance Metrics`);
      console.log(`Resource URL: ${entry.name}`);
      console.log(`Start fetch: ${fmt(entry.startTime)}`);
      console.log(`Response start (TTFB): ${fmt(entry.responseStart)}`);
      console.log(`Response end: ${fmt(entry.responseEnd)}`);
      console.log(`Total duration: ${fmt(entry.duration)}`);
      console.log(`DNS lookup: ${fmt(dnsTime)}`);
      console.log(`TCP handshake: ${fmt(tcpTime)}`);
      console.log(`Download time: ${fmt(downloadTime)}`);
      console.log(`File sizes (bytes):`);
      console.log(`- Transfer size: ${entry.transferSize || "N/A"}`);
      console.log(`- Encoded (compressed) size: ${entry.encodedBodySize || "N/A"}`);
      console.log(`- Decoded (uncompressed) size: ${entry.decodedBodySize || "N/A"}`);
      console.log(`Loaded before DOM ready? ${loadedBeforeDOM}`);
      console.log(`Loaded before window load? ${loadedBeforeWindow}`);
      console.log(`DOMContentLoaded: ${fmt(domReady)}`);
      console.log(`Window load: ${fmt(windowLoad)}`);
      console.groupEnd();
    } else if (attempts >= maxAttempts) {
      clearInterval(pollGTM);
      console.warn(`GTM.js not detected in performance entries after ${maxAttempts * checkInterval}ms`);
    }
  }, checkInterval);
})();