PHPackages basecom/magento2-speculation-rules-toolbox - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Utility & Helpers](/categories/utility) 4. / 5. basecom/magento2-speculation-rules-toolbox ActiveMagento2-module[Utility & Helpers](/categories/utility) basecom/magento2-speculation-rules-toolbox ========================================== Magento2 module to provide extensive functionality for speculation rules 0.9.3(7mo ago)17932↓35.7%2MITPHPPHP ~8.1 Since Mar 12Pushed 7mo ago1 watchersCompare [ Source](https://github.com/basecom/magento2-speculation-rules-toolbox)[ Packagist](https://packagist.org/packages/basecom/magento2-speculation-rules-toolbox)[ RSS](/packages/basecom-magento2-speculation-rules-toolbox/feed)WikiDiscussions develop Synced 1mo ago READMEChangelogDependencies (4)Versions (6)Used By (0) Basecom\_SpeculationRulesToolbox Module ======================================= [](#basecom_speculationrulestoolbox-module) [![Packagist](https://camo.githubusercontent.com/0409b1702b818d8d90dc1d713d04d30cb3177e8947a2026955a5eceed2b27f22/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f62617365636f6d2f6d6167656e746f322d73706563756c6174696f6e2d72756c65732d746f6f6c626f782e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/basecom/magento2-speculation-rules-toolbox)[![Software License](https://camo.githubusercontent.com/55c0218c8f8009f06ad4ddae837ddd05301481fcf0dff8e0ed9dadda8780713e/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4d49542d627269676874677265656e2e7376673f7374796c653d666c61742d737175617265)](LICENSE)[![Supported Magento Versions](https://camo.githubusercontent.com/2113b3a30955562f026a2b7dda3a09fee30d0c49aacbfce67193c5dc7b434617/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6d6167656e746f2d322e342d627269676874677265656e2e7376673f6c6f676f3d6d6167656e746f266c6f6e6743616368653d74727565267374796c653d666c61742d737175617265)](https://camo.githubusercontent.com/2113b3a30955562f026a2b7dda3a09fee30d0c49aacbfce67193c5dc7b434617/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6d6167656e746f2d322e342d627269676874677265656e2e7376673f6c6f676f3d6d6167656e746f266c6f6e6743616368653d74727565267374796c653d666c61742d737175617265) --- Warning Speculation Rules are still an experimental browser feature. Check the [browser compatibility table](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API#browser_compatibility)to see which browsers support it. Browser compatibility is ensured in this module by running a check before any scripts are appended to the DOM. Browser extensions (such as AdBlockers) can block execution. Unleash the full potential of your website's performance with the ⚡ **Speculationrules Toolbox** ⚡ This module provides extensive functionality for utilizing the **Speculation Rules API** ( see [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API)and [Chrome for Developers](https://developer.chrome.com/docs/web-platform/prerender-pages)). Speculation rules can vastly improve the core web vitals of a website, by allowing for very fast or even instant pageloads. This is achieved by preloading relevant resources and links in advance, before the users navigates to them. Super fast and easy to configure - with just a few clicks you can add your own custom script or utilize the powerful features of this module. Such as dynamically loading links based on a CSS-selector, a list of static custom links, or utilizing the [Intersection Observer API](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API)to identify relevant link targets based on images in view. Note In the context of this module, the term "preload" always refers to "speculative loading". Thus, "preload type" infers "speculative loading type". The two preload types available are [prefetch](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API#using_prefetching)and [prerender](https://developer.mozilla.org/en-US/docs/Web/API/Speculation_Rules_API#using_prerendering). Installation ------------ [](#installation) 1. Install the module via composer ``` composer require basecom/magento2-speculation-rules-toolbox ``` 2. Enable the module ``` bin/magento module:enable Basecom_SpeculationRulesToolbox bin/magento setup:upgrade ``` Configuration ------------- [](#configuration) The module can be enabled and configured under `Stores > Configuration > Basecom > Performance > Speculation Rules Toolbox > Enable Speculation Rules`. If this setting is not enabled, no preloading will occur. It is used in the layout.xml to render the parent block. The configurations have been carefully selected to allow for fast and simple setup, while also providing enough freedom for customization. [![configuration.png](docs/images/configuration.png)](docs/images/configuration.png) --- There are a total of five different preload strategies that can be configured: - [Moderate preloading](#moderate-preloading) - [Custom script](#custom-script) - [Custom links](#custom-links) - [Dynamic links](#dynamic-links) - [Dynamic Intersections](#dynamic-intersections) These strategies will be explained in more detail below. Note Some of these strategies will apply to **all pages** that you visit, while others can be configured individually for the **Homepage**, Product Listing Page (**PLP**) & Search, as well as the Product Detail Page (**PDP**). These settings are facilitated in their respective group. ### Moderate Preloading [](#moderate-preloading) Preload links based on the user behavior. Adds a predefined speculation rules script. Preloads are triggered when the user hovers over a link for more than 200ms. This functionality is only available on desktop devices, as mobile users cannot provide the hover input. This is a quick and easy setting you can enable in the beginning, to improve the performance for desktop users. This is the equivalent to Hyva's implementation, which can be enabled under `Stores > Configuration > Hyva Themes > Experimental > Experimental Features > Enable Prerender Speculation Rules`. However, the Hyva implementation requires changes to the .phtml-template to modify the logic. [![moderate_preloading_configuration.png](docs/images/moderate_preloading_configuration.png)](docs/images/moderate_preloading_configuration.png) Enable: `basecom_performance/speculation_rules_toolbox/moderate_enabled` **Configurable for**`All pages`**Eagerness**`Moderate`Tip Setting the preload type to "prerender" provides a great synergy when used in combination with prefetching other targets. ### Custom Script [](#custom-script) Add your own custom speculation rules script to all pages. This is mainly intended to allow for customization of missing, desired functionality. For example, you could implement your own prefetch / prerender rules based on custom data-attributes. [![custom_script_configuration.png](docs/images/custom_script_configuration.png)](docs/images/custom_script_configuration.png) Enable: `basecom_performance/speculation_rules/all_pages/custom_script_enabled` **Configurable for**`All pages`**Eagerness**Can be configured in the custom script### Custom Links [](#custom-links) Upon pageload, preload a user defined list of links. Useful for providing relevant resources to the user early. [![custom_links_configuration.png](docs/images/custom_links_configuration.png)](docs/images/custom_links_configuration.png) Enable (Scope): `basecom_performance/speculation_rules_toolbox/{{ scope }}/custom_links_enabled` **Configurable for**`All pages`,`Homepage`,`PLP`,`PDP`**Eagerness**`Immediate`### Dynamic Links [](#dynamic-links) Upon pageload, dynamically preload link targets based on a user defined CSS-selector. If the provided CSS-selector already queries a-elements, then these will be used to extract the hrefs for preloads. Alternatively you can provide a CSS-selector for any other element. The script will query the first result and look for a-elements inside manually. Use the `concurrent_preloads` setting to configure the maximum concurrent preloads for desktop and mobile devices. You may want to select a lower value for mobile devices, as their bandwidth and mobile data is limited. Depending on the `concurrent_preloads` value for the selected device, the preloads will be limited. [![dynamic_links_configuration.png](docs/images/dynamic_links_configuration.png)](docs/images/dynamic_links_configuration.png) Tip For a quick and effective setup, use a CSS-selector that targets a product list container. This allows you to preload the first products, which the user is likely to navigate to, if the recommendation is useful. Enable (Scope): `basecom_performance/speculation_rules_toolbox/{{ scope }}/dynamic_links_enabled` **Configurable for**`Homepage`,`PLP`,`PDP`**Eagerness**`Immediate`--- ### Dynamic Intersections [](#dynamic-intersections) Create new rules dynamically based on the visible images on the page. Adds an observer to the page that checks for visible images in the viewport. If an image crosses the user defined threshold (in regard to both its visibility and the duration of visibility), the href is extracted and a preload is initiated. The observer only considers images which are either direct or indirect ancestors of an anchoir-element (``). Use the `concurrent_preloads` setting to configure the maximum concurrent preloads for desktop and mobile devices. You may want to select a lower value for mobile devices, as their bandwidth and mobile data is limited. When an image intersection is detected, the script attempts to add a new script with the respective link target to the DOM. This is necessary, because we want more recent preloads to overrule existing ones, as the user is more likely to navigate to an element that is directly in view. If the amount of existing scrips is below the `concurrent_preloads` value for the selected device, the script is simply appended to the DOM. If the amount of existing scripts has reached the `concurrent_preloads` value for the selected device, the oldest entry is removed (based on the **F**irst **I**n, **F**irst **O**ut = **FIFO**-principle) and the new script is added to the DOM. The eagerness of `immediate` ensures that no user interaction is needed to initiate the preload. [![dynamic_intersections_configuration.png](docs/images/dynamic_intersections_configuration.png)](docs/images/dynamic_intersections_configuration.png) Enable: `basecom_performance/speculation_rules_toolbox/dynamic_intersections/enabled` **Configurable for**`All pages`,`Homepage`,`PLP`,`PDP`**Eagerness**`Immediate`Contributing ------------ [](#contributing) Please see [CONTRIBUTING](CONTRIBUTING.md) for details. Security -------- [](#security) If you discover any security related issues, please email instead of using the issue tracker. License ------- [](#license) Licensed under the [MIT](LICENSE) license. Copyright --------- [](#copyright) basecom GmbH & Co. KG ### Health Score 37 — LowBetter than 83% of packages Maintenance63 Regular maintenance activity Popularity27 Limited adoption so far Community9 Small or concentrated contributor base Maturity40 Maturing project, gaining track record Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~69 days Total 4 Last Release 223d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/4a67758dd1f3d42f956d3954dd65c125cdb85d0750c2cea0afaa139d4d5f5acb?d=identicon)[basecom](/maintainers/basecom) --- Top Contributors [![FinnReinhardtBsc](https://avatars.githubusercontent.com/u/122025487?v=4)](https://github.com/FinnReinhardtBsc "FinnReinhardtBsc (5 commits)") --- Tags core-web-vitalshyva-compatiblemagentomagento2magento2-extensionmagento2-extension-freemagento2-modulemagento2-pluginpagespeedperformance-optimizationspeculation-rules ### Embed Badge ![Health badge](/badges/basecom-magento2-speculation-rules-toolbox/health.svg) ``` [![Health](https://phpackages.com/badges/basecom-magento2-speculation-rules-toolbox/health.svg)](https://phpackages.com/packages/basecom-magento2-speculation-rules-toolbox) ``` ### Alternatives [fastly/magento2 Fastly CDN Module for Magento 2.4.x 1564.2M1](/packages/fastly-magento2)[baldwin/magento2-module-url-data-integrity-checker Magento 2 module which can find potential url related problems in your catalog data 281773.3k](/packages/baldwin-magento2-module-url-data-integrity-checker)[yireo/magento2-webp2 Magento 2 module to add WebP support to the Magento frontend 2091.2M7](/packages/yireo-magento2-webp2)[mage-os/module-inventory-reservations-grid Add a grid with the list of inventory reservations. 126.8k](/packages/mage-os-module-inventory-reservations-grid) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)