Speculation Rules for Faster Page Loads

<!-- Speculation Rules for instant navigation -->
{{- /* Only enable this in production */}}
{{- if hugo.IsProduction | or (eq site.Params.env "production") }}
<script type="speculationrules">
  {
    // Prefetch and prerender all internal pages but wait 200ms (moderate eagerness) after hover
    "prerender": [{ "where": { "href_matches": "/*" }, "eagerness": "moderate" }],
    "prefetch": [{ "where": { "href_matches": "/*" }, "eagerness": "moderate" }]
  }
</script>
<script>
  // Fallback for browsers that don't support the Speculation Rules API
  if (!HTMLScriptElement.supports || !HTMLScriptElement.supports('speculationrules')) {
    // Track preloaded URLs to avoid duplicate requests
    const preloadedUrls = {};

    function pointerenterHandler() {
      if (!this.href) return; // Skip if no href
      if (!this.href.startsWith(location.origin)) return; // Skip external links
      if (preloadedUrls[this.href]) return; // Skip duplicates
      preloadedUrls[this.href] = true; // Mark as preloaded

      const prefetcher = document.createElement('link');
      const supportsPrefetch = prefetcher.relList && prefetcher.relList.supports && prefetcher.relList.supports('prefetch'); // Check if browser supports prefetch
      prefetcher.as = supportsPrefetch ? 'document' : 'fetch'; // Set as document or fetch (older browsers)
      prefetcher.rel = supportsPrefetch ? 'prefetch' : 'preload'; // Set as prefetch or preload (older browsers)
      prefetcher.href = this.href;
      document.head.appendChild(prefetcher); // Add to head
    }

    document.addEventListener('DOMContentLoaded', function () {
      const conn = navigator.connection || navigator.mozConnection || navigator.webkitConnection;
      const saveData = conn && conn.saveData;
      const isVerySlow = conn && /(^|-)2g($|-)/.test(String(conn.effectiveType || ''));
      if (saveData || isVerySlow) return; // Skip for data saver and slow connections
      document.querySelectorAll('a[href^="/"]').forEach(function (item) {
        item.addEventListener('pointerenter', pointerenterHandler, { passive: true }); // Add event listener when pointer enters link area
      });
    });
  }
</script>
{{- end }}