chunk-047-performance.js

I’ll build this as a safe, standalone performance chunk for RX Theme: no dependencies, WordPress-friendly, browser-feature checks, and defensive coding so one error will not break the site.

Dear friend, create this file:

/assets/static-js/static-chunks-js/chunk-047-performance.js

Use this advanced performance-focused code:

/*!
 * RX Theme - Chunk 047 Performance
 * File: /assets/static-js/static-chunks-js/chunk-047-performance.js
 * Purpose: Advanced front-end performance helpers for RX Theme
 * Author: RxHarun
 */

(function () {
  "use strict";

  /**
   * RX Performance Chunk
   *
   * Features:
   * 01. Safe namespace
   * 02. DOM ready helper
   * 03. Idle callback helper
   * 04. Passive event detection
   * 05. Debounce and throttle
   * 06. Lazy image enhancement
   * 07. Lazy background image support
   * 08. Iframe lazy loading
   * 09. Video lazy preload
   * 10. Font loading optimization
   * 11. External link security
   * 12. Prefetch on hover
   * 13. Instant page hinting
   * 14. Scroll performance optimization
   * 15. Header scroll class
   * 16. Back-to-top behavior
   * 17. Web Vitals helper hooks
   * 18. Resource timing collection
   * 19. Long task observer
   * 20. Layout shift observer
   * 21. Reduced motion support
   * 22. Save-data support
   * 23. Network-aware loading
   * 24. Print optimization
   * 25. BFCache restore handling
   * 26. DOM mutation optimization
   * 27. Image decoding
   * 28. Priority image detection
   * 29. Smart preload cleanup
   * 30. Safe public API
   */

  var RX = window.RXTheme = window.RXTheme || {};
  RX.performance = RX.performance || {};

  var doc = document;
  var win = window;
  var html = doc.documentElement;
  var body = doc.body;

  var config = {
    enableDebug: false,

    selectors: {
      header: ".site-header, .rx-site-header, header[role='banner']",
      backToTop: ".rx-back-to-top, [data-rx-back-to-top]",
      lazyImage: "img[data-src], img[data-srcset], img[loading='lazy']",
      lazyBackground: "[data-bg], [data-background]",
      lazyIframe: "iframe[data-src]",
      lazyVideo: "video[data-src], video source[data-src]",
      prefetchLink: "a[href]",
      externalLink: "a[href^='http']"
    },

    classes: {
      js: "rx-js",
      loaded: "rx-loaded",
      domReady: "rx-dom-ready",
      windowLoaded: "rx-window-loaded",
      scrolling: "rx-is-scrolling",
      scrolled: "rx-is-scrolled",
      scrollUp: "rx-scroll-up",
      scrollDown: "rx-scroll-down",
      lazyLoaded: "rx-lazy-loaded",
      lazyError: "rx-lazy-error",
      reducedMotion: "rx-reduced-motion",
      saveData: "rx-save-data",
      slowNetwork: "rx-slow-network",
      bfcacheRestored: "rx-bfcache-restored"
    },

    scroll: {
      scrolledOffset: 24,
      backToTopOffset: 400,
      scrollEndDelay: 120
    },

    prefetch: {
      enabled: true,
      delay: 80,
      maxLinks: 20,
      allowedSameOriginOnly: true
    },

    lazy: {
      rootMargin: "300px 0px",
      threshold: 0.01
    },

    metrics: {
      enabled: true,
      maxEntries: 100
    }
  };

  var state = {
    initialized: false,
    passiveSupported: false,
    lastScrollY: 0,
    ticking: false,
    scrollTimer: null,
    prefetched: new Set(),
    metrics: {
      longTasks: [],
      layoutShifts: [],
      resources: [],
      marks: {}
    }
  };

  function log() {
    if (!config.enableDebug || !win.console) return;
    try {
      console.log.apply(console, ["[RX Performance]"].concat([].slice.call(arguments)));
    } catch (e) {}
  }

  function warn() {
    if (!config.enableDebug || !win.console) return;
    try {
      console.warn.apply(console, ["[RX Performance]"].concat([].slice.call(arguments)));
    } catch (e) {}
  }

  function safeRun(fn, label) {
    try {
      return fn();
    } catch (error) {
      warn(label || "Safe run error", error);
      return null;
    }
  }

  function ready(fn) {
    if (doc.readyState === "loading") {
      doc.addEventListener("DOMContentLoaded", fn, { once: true });
    } else {
      fn();
    }
  }

  function onWindowLoad(fn) {
    if (doc.readyState === "complete") {
      fn();
    } else {
      win.addEventListener("load", fn, { once: true });
    }
  }

  function idle(fn, timeout) {
    if ("requestIdleCallback" in win) {
      return win.requestIdleCallback(fn, { timeout: timeout || 1500 });
    }

    return win.setTimeout(function () {
      fn({
        didTimeout: false,
        timeRemaining: function () {
          return 0;
        }
      });
    }, 1);
  }

  function raf(fn) {
    if ("requestAnimationFrame" in win) {
      return win.requestAnimationFrame(fn);
    }
    return win.setTimeout(fn, 16);
  }

  function debounce(fn, delay) {
    var timer = null;

    return function () {
      var context = this;
      var args = arguments;

      clearTimeout(timer);
      timer = setTimeout(function () {
        fn.apply(context, args);
      }, delay);
    };
  }

  function throttle(fn, limit) {
    var waiting = false;

    return function () {
      if (waiting) return;

      var context = this;
      var args = arguments;

      waiting = true;

      setTimeout(function () {
        waiting = false;
        fn.apply(context, args);
      }, limit);
    };
  }

  function detectPassiveSupport() {
    safeRun(function () {
      var options = Object.defineProperty({}, "passive", {
        get: function () {
          state.passiveSupported = true;
          return true;
        }
      });

      win.addEventListener("rxPassiveTest", null, options);
      win.removeEventListener("rxPassiveTest", null, options);
    }, "Passive detection failed");
  }

  function passiveOptions() {
    return state.passiveSupported ? { passive: true } : false;
  }

  function addClass(el, className) {
    if (el && className) {
      el.classList.add(className);
    }
  }

  function removeClass(el, className) {
    if (el && className) {
      el.classList.remove(className);
    }
  }

  function toggleClass(el, className, condition) {
    if (!el || !className) return;

    if (condition) {
      el.classList.add(className);
    } else {
      el.classList.remove(className);
    }
  }

  function queryAll(selector, context) {
    return Array.prototype.slice.call((context || doc).querySelectorAll(selector));
  }

  function isSameOrigin(url) {
    try {
      return new URL(url, win.location.href).origin === win.location.origin;
    } catch (e) {
      return false;
    }
  }

  function isValidPrefetchUrl(url) {
    if (!url) return false;

    try {
      var parsed = new URL(url, win.location.href);

      if (parsed.protocol !== "http:" && parsed.protocol !== "https:") return false;
      if (parsed.hash && parsed.pathname === win.location.pathname) return false;
      if (parsed.href === win.location.href) return false;
      if (config.prefetch.allowedSameOriginOnly && parsed.origin !== win.location.origin) return false;

      return true;
    } catch (e) {
      return false;
    }
  }

  function getConnection() {
    return navigator.connection || navigator.mozConnection || navigator.webkitConnection || null;
  }

  function isSaveDataEnabled() {
    var connection = getConnection();
    return !!(connection && connection.saveData);
  }

  function isSlowNetwork() {
    var connection = getConnection();

    if (!connection) return false;

    var type = connection.effectiveType || "";
    return type === "slow-2g" || type === "2g";
  }

  function applyEnvironmentClasses() {
    addClass(html, config.classes.js);

    if (isSaveDataEnabled()) {
      addClass(html, config.classes.saveData);
    }

    if (isSlowNetwork()) {
      addClass(html, config.classes.slowNetwork);
    }

    if (win.matchMedia && win.matchMedia("(prefers-reduced-motion: reduce)").matches) {
      addClass(html, config.classes.reducedMotion);
    }
  }

  function mark(name) {
    if (!name) return;

    state.metrics.marks[name] = Date.now();

    if (win.performance && typeof win.performance.mark === "function") {
      safeRun(function () {
        win.performance.mark("rx-" + name);
      }, "Performance mark failed");
    }
  }

  function measure(name, startMark, endMark) {
    if (!win.performance || typeof win.performance.measure !== "function") return;

    safeRun(function () {
      win.performance.measure("rx-" + name, "rx-" + startMark, "rx-" + endMark);
    }, "Performance measure failed");
  }

  function enhanceImages(context) {
    var images = queryAll(config.selectors.lazyImage, context);

    images.forEach(function (img) {
      if (!img || img.dataset.rxEnhanced === "1") return;

      img.dataset.rxEnhanced = "1";

      if (!img.hasAttribute("decoding")) {
        img.setAttribute("decoding", "async");
      }

      if (!img.hasAttribute("loading")) {
        img.setAttribute("loading", "lazy");
      }

      img.addEventListener("load", function () {
        addClass(img, config.classes.lazyLoaded);
      }, { once: true });

      img.addEventListener("error", function () {
        addClass(img, config.classes.lazyError);
      }, { once: true });

      if (img.complete && img.naturalWidth > 0) {
        addClass(img, config.classes.lazyLoaded);
      }
    });
  }

  function decodeVisibleImages() {
    var images = queryAll("img");

    images.slice(0, 8).forEach(function (img) {
      if (!img || typeof img.decode !== "function") return;
      if (img.dataset.rxDecoded === "1") return;

      img.dataset.rxDecoded = "1";

      safeRun(function () {
        img.decode().catch(function () {});
      }, "Image decode failed");
    });
  }

  function loadLazyImage(img) {
    if (!img || img.dataset.rxLazyLoaded === "1") return;

    var src = img.getAttribute("data-src");
    var srcset = img.getAttribute("data-srcset");
    var sizes = img.getAttribute("data-sizes");

    if (srcset) {
      img.setAttribute("srcset", srcset);
      img.removeAttribute("data-srcset");
    }

    if (sizes) {
      img.setAttribute("sizes", sizes);
      img.removeAttribute("data-sizes");
    }

    if (src) {
      img.setAttribute("src", src);
      img.removeAttribute("data-src");
    }

    img.dataset.rxLazyLoaded = "1";
  }

  function loadLazyBackground(el) {
    if (!el || el.dataset.rxBgLoaded === "1") return;

    var bg = el.getAttribute("data-bg") || el.getAttribute("data-background");
    if (!bg) return;

    el.style.backgroundImage = "url('" + bg.replace(/'/g, "\\'") + "')";
    el.dataset.rxBgLoaded = "1";
    el.removeAttribute("data-bg");
    el.removeAttribute("data-background");
    addClass(el, config.classes.lazyLoaded);
  }

  function loadLazyIframe(iframe) {
    if (!iframe || iframe.dataset.rxIframeLoaded === "1") return;

    var src = iframe.getAttribute("data-src");
    if (!src) return;

    iframe.setAttribute("src", src);
    iframe.removeAttribute("data-src");
    iframe.dataset.rxIframeLoaded = "1";
    addClass(iframe, config.classes.lazyLoaded);
  }

  function setupLazyLoading(context) {
    var lazyImages = queryAll("img[data-src], img[data-srcset]", context);
    var lazyBackgrounds = queryAll(config.selectors.lazyBackground, context);
    var lazyIframes = queryAll(config.selectors.lazyIframe, context);

    if (!("IntersectionObserver" in win)) {
      lazyImages.forEach(loadLazyImage);
      lazyBackgrounds.forEach(loadLazyBackground);
      lazyIframes.forEach(loadLazyIframe);
      return;
    }

    var observer = new IntersectionObserver(function (entries, obs) {
      entries.forEach(function (entry) {
        if (!entry.isIntersecting) return;

        var target = entry.target;

        if (target.tagName === "IMG") {
          loadLazyImage(target);
        } else if (target.tagName === "IFRAME") {
          loadLazyIframe(target);
        } else {
          loadLazyBackground(target);
        }

        obs.unobserve(target);
      });
    }, {
      rootMargin: config.lazy.rootMargin,
      threshold: config.lazy.threshold
    });

    lazyImages.forEach(function (img) {
      observer.observe(img);
    });

    lazyBackgrounds.forEach(function (el) {
      observer.observe(el);
    });

    lazyIframes.forEach(function (iframe) {
      observer.observe(iframe);
    });
  }

  function setupLazyVideos(context) {
    var videos = queryAll("video[data-src]", context);
    var sources = queryAll("video source[data-src]", context);

    function loadVideo(video) {
      if (!video || video.dataset.rxVideoLoaded === "1") return;

      var src = video.getAttribute("data-src");
      if (src) {
        video.setAttribute("src", src);
        video.removeAttribute("data-src");
      }

      queryAll("source[data-src]", video).forEach(function (source) {
        source.setAttribute("src", source.getAttribute("data-src"));
        source.removeAttribute("data-src");
      });

      safeRun(function () {
        video.load();
      }, "Video load failed");

      video.dataset.rxVideoLoaded = "1";
    }

    if (!("IntersectionObserver" in win)) {
      videos.forEach(loadVideo);
      sources.forEach(function (source) {
        if (source.parentNode && source.parentNode.tagName === "VIDEO") {
          loadVideo(source.parentNode);
        }
      });
      return;
    }

    var observer = new IntersectionObserver(function (entries, obs) {
      entries.forEach(function (entry) {
        if (!entry.isIntersecting) return;

        var target = entry.target;
        var video = target.tagName === "VIDEO" ? target : target.closest("video");

        loadVideo(video);
        obs.unobserve(target);
      });
    }, {
      rootMargin: "500px 0px",
      threshold: 0.01
    });

    videos.forEach(function (video) {
      observer.observe(video);
    });

    sources.forEach(function (source) {
      if (source.parentNode && source.parentNode.tagName === "VIDEO") {
        observer.observe(source.parentNode);
      }
    });
  }

  function setupPriorityImages() {
    var firstImages = queryAll("main img, .site-main img, article img").slice(0, 2);

    firstImages.forEach(function (img, index) {
      if (!img) return;

      if (index === 0) {
        img.setAttribute("fetchpriority", "high");
        img.setAttribute("loading", "eager");
      } else if (!img.hasAttribute("loading")) {
        img.setAttribute("loading", "lazy");
      }

      if (!img.hasAttribute("decoding")) {
        img.setAttribute("decoding", "async");
      }
    });
  }

  function setupIframeOptimization() {
    var iframes = queryAll("iframe");

    iframes.forEach(function (iframe) {
      if (!iframe.hasAttribute("loading")) {
        iframe.setAttribute("loading", "lazy");
      }

      if (!iframe.hasAttribute("referrerpolicy")) {
        iframe.setAttribute("referrerpolicy", "strict-origin-when-cross-origin");
      }
    });
  }

  function setupExternalLinks() {
    var links = queryAll(config.selectors.externalLink);

    links.forEach(function (link) {
      if (!link.hostname || link.hostname === win.location.hostname) return;

      var rel = (link.getAttribute("rel") || "").split(/\s+/);

      if (rel.indexOf("noopener") === -1) rel.push("noopener");
      if (rel.indexOf("noreferrer") === -1) rel.push("noreferrer");

      link.setAttribute("rel", rel.join(" ").trim());

      if (!link.hasAttribute("target")) {
        link.setAttribute("target", "_blank");
      }
    });
  }

  function prefetchUrl(url) {
    if (!config.prefetch.enabled) return;
    if (!isValidPrefetchUrl(url)) return;
    if (state.prefetched.has(url)) return;
    if (state.prefetched.size >= config.prefetch.maxLinks) return;
    if (isSaveDataEnabled() || isSlowNetwork()) return;

    state.prefetched.add(url);

    idle(function () {
      var link = doc.createElement("link");
      link.rel = "prefetch";
      link.href = url;
      link.as = "document";
      doc.head.appendChild(link);
      log("Prefetched:", url);
    }, 1000);
  }

  function setupHoverPrefetch() {
    if (!config.prefetch.enabled) return;

    var timer = null;

    doc.addEventListener("mouseover", function (event) {
      var link = event.target.closest && event.target.closest("a[href]");

      if (!link) return;

      var href = link.href;

      clearTimeout(timer);

      timer = setTimeout(function () {
        prefetchUrl(href);
      }, config.prefetch.delay);
    }, passiveOptions());

    doc.addEventListener("touchstart", function (event) {
      var link = event.target.closest && event.target.closest("a[href]");

      if (!link) return;

      prefetchUrl(link.href);
    }, passiveOptions());
  }

  function handleScroll() {
    var currentY = win.pageYOffset || html.scrollTop || 0;
    var goingDown = currentY > state.lastScrollY;

    toggleClass(html, config.classes.scrolled, currentY > config.scroll.scrolledOffset);
    toggleClass(html, config.classes.scrollDown, goingDown && currentY > config.scroll.scrolledOffset);
    toggleClass(html, config.classes.scrollUp, !goingDown && currentY > config.scroll.scrolledOffset);

    state.lastScrollY = currentY <= 0 ? 0 : currentY;
    state.ticking = false;
  }

  function onScroll() {
    addClass(html, config.classes.scrolling);

    if (!state.ticking) {
      state.ticking = true;
      raf(handleScroll);
    }

    clearTimeout(state.scrollTimer);

    state.scrollTimer = setTimeout(function () {
      removeClass(html, config.classes.scrolling);
    }, config.scroll.scrollEndDelay);
  }

  function setupScrollOptimization() {
    win.addEventListener("scroll", onScroll, passiveOptions());
    handleScroll();
  }

  function setupHeaderPerformance() {
    var header = doc.querySelector(config.selectors.header);

    if (!header) return;

    if (!header.style.willChange) {
      header.style.willChange = "transform";
    }
  }

  function setupBackToTop() {
    var buttons = queryAll(config.selectors.backToTop);

    if (!buttons.length) return;

    function updateButtons() {
      var y = win.pageYOffset || html.scrollTop || 0;

      buttons.forEach(function (button) {
        toggleClass(button, "is-visible", y > config.scroll.backToTopOffset);
        button.setAttribute("aria-hidden", y > config.scroll.backToTopOffset ? "false" : "true");
      });
    }

    buttons.forEach(function (button) {
      button.addEventListener("click", function (event) {
        event.preventDefault();

        win.scrollTo({
          top: 0,
          behavior: html.classList.contains(config.classes.reducedMotion) ? "auto" : "smooth"
        });
      });
    });

    win.addEventListener("scroll", throttle(updateButtons, 100), passiveOptions());
    updateButtons();
  }

  function setupFontOptimization() {
    if (!("fonts" in doc)) return;

    safeRun(function () {
      doc.fonts.ready.then(function () {
        addClass(html, "rx-fonts-loaded");
      });
    }, "Font loading hook failed");
  }

  function cleanUnusedPreloads() {
    var preloads = queryAll("link[rel='preload']");

    preloads.forEach(function (link) {
      var href = link.href;
      if (!href) return;

      link.addEventListener("error", function () {
        safeRun(function () {
          link.parentNode.removeChild(link);
        }, "Preload cleanup failed");
      }, { once: true });
    });
  }

  function setupPrintOptimization() {
    win.addEventListener("beforeprint", function () {
      addClass(html, "rx-before-print");
    });

    win.addEventListener("afterprint", function () {
      removeClass(html, "rx-before-print");
    });
  }

  function observeLongTasks() {
    if (!config.metrics.enabled) return;
    if (!("PerformanceObserver" in win)) return;

    safeRun(function () {
      var observer = new PerformanceObserver(function (list) {
        list.getEntries().forEach(function (entry) {
          state.metrics.longTasks.push({
            name: entry.name,
            startTime: entry.startTime,
            duration: entry.duration
          });

          if (state.metrics.longTasks.length > config.metrics.maxEntries) {
            state.metrics.longTasks.shift();
          }
        });
      });

      observer.observe({ entryTypes: ["longtask"] });
    }, "Long task observer unavailable");
  }

  function observeLayoutShifts() {
    if (!config.metrics.enabled) return;
    if (!("PerformanceObserver" in win)) return;

    safeRun(function () {
      var observer = new PerformanceObserver(function (list) {
        list.getEntries().forEach(function (entry) {
          if (entry.hadRecentInput) return;

          state.metrics.layoutShifts.push({
            value: entry.value,
            startTime: entry.startTime,
            sources: entry.sources ? entry.sources.length : 0
          });

          if (state.metrics.layoutShifts.length > config.metrics.maxEntries) {
            state.metrics.layoutShifts.shift();
          }
        });
      });

      observer.observe({ type: "layout-shift", buffered: true });
    }, "Layout shift observer unavailable");
  }

  function collectResourceTiming() {
    if (!config.metrics.enabled) return;
    if (!win.performance || typeof win.performance.getEntriesByType !== "function") return;

    idle(function () {
      safeRun(function () {
        state.metrics.resources = win.performance
          .getEntriesByType("resource")
          .slice(-config.metrics.maxEntries)
          .map(function (entry) {
            return {
              name: entry.name,
              type: entry.initiatorType,
              duration: Math.round(entry.duration),
              transferSize: entry.transferSize || 0
            };
          });
      }, "Resource timing collection failed");
    }, 2000);
  }

  function setupBFCacheHandling() {
    win.addEventListener("pageshow", function (event) {
      if (event.persisted) {
        addClass(html, config.classes.bfcacheRestored);

        safeRun(function () {
          handleScroll();
          decodeVisibleImages();
        }, "BFCache restore failed");
      }
    });
  }

  function setupMutationOptimization() {
    if (!("MutationObserver" in win)) return;

    var debouncedEnhance = debounce(function () {
      safeRun(function () {
        enhanceImages(doc);
        setupIframeOptimization();
        setupExternalLinks();
      }, "Mutation enhancement failed");
    }, 250);

    var observer = new MutationObserver(function (mutations) {
      var shouldRun = false;

      mutations.forEach(function (mutation) {
        if (mutation.addedNodes && mutation.addedNodes.length) {
          shouldRun = true;
        }
      });

      if (shouldRun) {
        debouncedEnhance();
      }
    });

    ready(function () {
      if (!doc.body) return;

      observer.observe(doc.body, {
        childList: true,
        subtree: true
      });
    });
  }

  function setupVisibilityOptimization() {
    doc.addEventListener("visibilitychange", function () {
      if (doc.hidden) {
        addClass(html, "rx-page-hidden");
      } else {
        removeClass(html, "rx-page-hidden");
        collectResourceTiming();
      }
    });
  }

  function setupErrorProtection() {
    win.addEventListener("error", function (event) {
      if (!config.enableDebug) return;

      warn("Window error:", event.message);
    });

    win.addEventListener("unhandledrejection", function (event) {
      if (!config.enableDebug) return;

      warn("Unhandled promise rejection:", event.reason);
    });
  }

  function getCLS() {
    return state.metrics.layoutShifts.reduce(function (sum, item) {
      return sum + (item.value || 0);
    }, 0);
  }

  function getLongTaskTotal() {
    return state.metrics.longTasks.reduce(function (sum, item) {
      return sum + (item.duration || 0);
    }, 0);
  }

  function getReport() {
    return {
      initialized: state.initialized,
      saveData: isSaveDataEnabled(),
      slowNetwork: isSlowNetwork(),
      prefetchedLinks: state.prefetched.size,
      clsApprox: Number(getCLS().toFixed(4)),
      longTaskCount: state.metrics.longTasks.length,
      longTaskTotal: Math.round(getLongTaskTotal()),
      resourceCount: state.metrics.resources.length,
      marks: state.metrics.marks
    };
  }

  function init() {
    if (state.initialized) return;

    state.initialized = true;

    mark("performance-init-start");

    detectPassiveSupport();
    applyEnvironmentClasses();
    setupErrorProtection();
    setupBFCacheHandling();
    setupVisibilityOptimization();

    ready(function () {
      mark("dom-ready");

      addClass(html, config.classes.domReady);

      safeRun(function () {
        body = doc.body;

        setupPriorityImages();
        enhanceImages(doc);
        setupLazyLoading(doc);
        setupLazyVideos(doc);
        setupIframeOptimization();
        setupExternalLinks();
        setupHoverPrefetch();
        setupScrollOptimization();
        setupHeaderPerformance();
        setupBackToTop();
        setupFontOptimization();
        setupPrintOptimization();
        setupMutationOptimization();
        cleanUnusedPreloads();
        decodeVisibleImages();

        observeLongTasks();
        observeLayoutShifts();

        mark("performance-init-end");
        measure("performance-init", "performance-init-start", "performance-init-end");
      }, "RX performance DOM init failed");
    });

    onWindowLoad(function () {
      mark("window-loaded");

      addClass(html, config.classes.windowLoaded);

      idle(function () {
        collectResourceTiming();
      }, 2500);
    });

    log("Initialized");
  }

  RX.performance.config = config;
  RX.performance.state = state;
  RX.performance.init = init;
  RX.performance.ready = ready;
  RX.performance.idle = idle;
  RX.performance.debounce = debounce;
  RX.performance.throttle = throttle;
  RX.performance.prefetchUrl = prefetchUrl;
  RX.performance.enhanceImages = enhanceImages;
  RX.performance.setupLazyLoading = setupLazyLoading;
  RX.performance.getReport = getReport;
  RX.performance.mark = mark;
  RX.performance.measure = measure;

  init();

})();

To load it in RX Theme, add this in your enqueue file or functions.php:

wp_enqueue_script(
    'rx-chunk-047-performance',
    get_template_directory_uri() . '/assets/static-js/static-chunks-js/chunk-047-performance.js',
    array(),
    wp_get_theme()->get('Version'),
    true
);

For better loading performance, also add defer:

add_filter('script_loader_tag', function ($tag, $handle, $src) {
    if ($handle === 'rx-chunk-047-performance') {
        return '<script src="' . esc_url($src) . '" id="' . esc_attr($handle) . '-js" defer></script>' . "\n";
    }

    return $tag;
}, 10, 3);

Best folder position:

rx-theme/
└── assets/
    └── static-js/
        └── static-chunks-js/
            └── chunk-047-performance.js

This file is safe for advanced RX Theme use because it checks browser support before using modern features and keeps all functions inside the window.RXTheme.performance namespace.

Leave a Reply

Your email address will not be published. Required fields are marked *