🧠 3. Advanced Topics & Integrations

This section covers advanced configurations and strategies for maximizing the performance benefits of the JaJuMa Page Preload extension, including server-side caching with Varnish and creating a hybrid performance solution with the native Speculation Rules API.

⚡ 3.1 Varnish Integration for High-Performance Caching

For Magento 2 stores operating at scale, using Varnish as a full-page cache (FPC) is a standard best practice for achieving optimal performance.
The JaJuMa Page Preload extension is designed to work seamlessly with Varnish, but it requires a small addition to your Varnish Configuration Language (VCL) file to ensure correct caching behavior for prefetched resources.

3.1.1 The VCL Snippet

To enable proper cache control for preloaded pages, you must add the following snippet to your default.vcl file,
typically located at /etc/varnish/default.vcl.
This code should be placed within the vcl_deliver subroutine.

    sub vcl_deliver {
        #... other vcl_deliver logic...

        # JaJuMa Page Preload: Instruct browser on how to cache prefetched pages.
        # The <TTL> value should match the "Preloaded Content TTL" setting in the extension configuration.
        if (req.http.purpose ~ "prefetch") {
            set resp.http.Cache-Control = "must-revalidate, no-cache, max-age=<TTL>";
        }

        #... other vcl_deliver logic...
    }

Replace `<TTL>` with the same value (in seconds)  
that is configured in the extension's `Preload Cache Control` settings (e.g., `300`).  
After adding this code, you must reload your Varnish configuration.

Why This VCL Rule Works:

When the extension initiates a preload, the browser adds a Sec-Purpose: prefetch header to the HTTP request.
The VCL rule uses this header to identify these specific requests. The Cache-Control header it sets instructs the client's browser to store the page in its local memory cache (max-age=<TTL>) while telling shared caches like Varnish to revalidate the resource before serving a stored copy (no-cache).
This ensures an optimal balance of performance and data freshness.

🤝 3.2 Best Practices for a Hybrid Performance Strategy

To deliver the absolute best performance to all users, the recommended approach is to combine the JaJuMa Page Preload extension with the native Speculation Rules API.
This hybrid strategy ensures that users on Chromium browsers get the "instant" prerender experience, while users on Firefox still receive a significant performance boost from the extension's universal prefetch capabilities.

💡 Pro Tip:
Both techniques also work well together and alongside each other.
For maximum performance impact you may also use both at the same time in Chromium based Browsers.

3.2.1 Simple Implementation

The easiest and most effective way to implement a hybrid strategy is to simply use both technologies simultaneously.

1. Install and configure the JaJuMa Page Preload extension.
2. Separately, add a <script type="speculationrules"> tag to your site's HTML to define prerender rules for your most likely navigation targets.

Browsers that do not support the Speculation Rules API will simply ignore the script tag, and the JaJuMa extension will handle the prefetching.
Chromium-based browsers will process both, typically prioritizing the more powerful prerender action and de-duplicating the requests to avoid redundant work.

3.2.2 Advanced Implementation (Conditional Loading)

For developers seeking ultimate control, a conditional loading approach can be implemented using JavaScript to detect browser support for the Speculation Rules API and only initializing a prefetcher if native support is absent.

// Conceptual example to illustrate detection logic.
// The JaJuMa extension can handle this automatically via its configuration.
if (HTMLScriptElement.supports && HTMLScriptElement.supports('speculationrules')) {
  // Browser supports Speculation Rules.
  // Rely on the native API for prefetching and prerendering.
  console.log('Speculation Rules API is supported. Native implementation will be used.');
} else {
  // Browser does not support Speculation Rules.
  // Relying on fallback prefetcher like JaJuMa Page Preload.
  console.log('Speculation Rules not supported. Relying on fallback prefetcher.');
}

3.2.3 The Smart Implementation (Recommended)

For the ultimate performance strategy, the JaJuMa Smart Speculation Rules extension elevates the hybrid approach.
It provides "Smart Speculative Loading" by enabling predictive, data-driven prerendering and prefetching based on Google Analytics or Matomo data, in addition to dynamic speculation based on user interaction.

This advanced solution is fully configurable from the Magento backend, removing the need to manually create and maintain JSON rule files.
Crucially, it also resolves common Magento incompatibilities with the native Speculation Rules API, making it the most advanced and robust implementation available.

💡 Pro Tip:
JaJuMa Page Preload extension + the most advanced Speculation Rules API implementation for Magento 2 is a powerful dream team to boost your Magento store performance and Core Web Vitals.

📞 Need Help?

Still have questions or need help with your configuration? Our expert team is here to assist. Please don't hesitate to contact our support team for personalized assistance.