Speculative Loading

Beschreibung

This plugin adds support for the Speculation Rules API, which allows defining rules by which certain URLs are dynamically prefetched or prerendered.

See the Speculation Rules WICG specification draft.

By default, the plugin is configured to prerender WordPress frontend URLs when the user interacts with a relevant link. This can be customized via the „Speculative Loading“ section in the Settings > Reading admin screen.

A filter can be used to exclude certain URL paths from being eligible for prefetching and prerendering (see FAQ section). Alternatively, you can add the no-prerender CSS class to any link (<a> tag) that should not be prerendered. See FAQ for more information.

Browser support

The Speculation Rules API is a new web API, and the functionality used by the plugin is supported in Chromium-based browsers such as Chrome, Edge, or Opera using version 121 or above. Other browsers such as Safari and Firefox will ignore the functionality with no ill effects; they will simply not benefit from the speculative loading. Note that certain browser extensions may disable preloading by default.

This plugin was formerly known as Speculation Rules.

Installation

Installation from within WordPress

  1. Visit Plugins > Add New.
  2. Search for Speculative Loading.
  3. Install and activate the Speculative Loading plugin.

Manual installation

  1. Upload the entire speculation-rules folder to the /wp-content/plugins/ directory.
  2. Visit Plugins.
  3. Activate the Speculative Loading plugin.

FAQ

How can I prevent certain URLs from being prefetched and prerendered?

Not every URL can be reasonably prerendered. Prerendering static content is typically reliable, however prerendering interactive content, such as a logout URL, can lead to issues. For this reason, certain WordPress core URLs such as /wp-login.php and /wp-admin/* are excluded from prefetching and prerendering. Additionally, any URLs generated with wp_nonce_url() (or which contains the _wpnonce query var) and nofollow links are also ignored. You can exclude additional URL patterns by using the plsr_speculation_rules_href_exclude_paths filter.

The following example ensures that URLs like https://example.com/cart/ or https://example.com/cart/foo are excluded from prefetching and prerendering:

<?php
add_filter(
    'plsr_speculation_rules_href_exclude_paths',
    function ( array $exclude_paths ): array {
        $exclude_paths[] = '/cart/*';
        return $exclude_paths;
    }
);

Keep in mind that sometimes it may be useful to exclude a URL from prerendering while still allowing it to be prefetched. For example, a page with client-side JavaScript to update user state should probably not be prerendered, but it would be reasonable to prefetch.

For this purpose, the plsr_speculation_rules_href_exclude_paths filter receives the current mode (either „prefetch“ or „prerender“) to provide conditional exclusions.

The following example ensures that URLs like https://example.com/products/... cannot be prerendered, while still allowing them to be prefetched:

<?php
add_filter(
    'plsr_speculation_rules_href_exclude_paths',
    function ( array $exclude_paths, string $mode ): array {
        if ( 'prerender' === $mode ) {
            $exclude_paths[] = '/products/*';
        }
        return $exclude_paths;
    },
    10,
    2
);

As mentioned above, adding the no-prerender CSS class to a link will prevent it from being prerendered (but not prefetched). Additionally, links with rel=nofollow will neither be prefetched nor prerendered because some plugins add this to non-idempotent links (e.g. add to cart); such links ideally should rather be buttons which trigger a POST request or at least they should use wp_nonce_url().

How will this impact analytics and personalization?

Prerendering can affect analytics and personalization.

For client-side JavaScript, is recommended to delay these until the prerender is activated (for example by clicking on the link). Some solutions (like Google Analytics) already do this automatically, see Impact on Analytics. Additionally, cross-origin iframes are not loaded until activation which can further avoid issues here.

Speculating with the default moderate eagerness decreases the risk that the prerendered page will not be visited by the user and therefore will avoid any side effects of loading such a link in advance. In contrast, eager speculation increases the risk that prerendered pages may not be loaded. Alternatively, the plugin offers to only speculate on mouse/pointer down (conservative) which reduces the risk even further and is an option for sites which are concerned about this, at the cost of having less of a lead time and so less of a performance gain.

A prerendered page is linked to the page that prerenders it, so personalisation may already be known by this point and changes (e.g. browsing other products, or logging in/out) often require a new page load, and hence a new prerender, which will then take these into account. But it definitely is something to be aware of and test! Prerendered pages can be canceled by removing the speculation rules <script> element from the page using standard JavaScript DOM APIs should this be needed when state changes without a new page load.

Where can I submit my plugin feedback?

Feedback is encouraged and much appreciated, especially since this plugin may contain future WordPress core features. If you have suggestions or requests for new features, you can submit them as an issue in the WordPress Performance Team’s GitHub repository. If you need help with troubleshooting or have a question about the plugin, please create a new topic on our support forum.

Where can I report security bugs?

The Performance team and WordPress community take security bugs seriously. We appreciate your efforts to responsibly disclose your findings, and will make every effort to acknowledge your contributions.

To report a security issue, please visit the WordPress HackerOne program.

How can I contribute to the plugin?

Contributions are always welcome! Learn more about how to get involved in the Core Performance Team Handbook.

Rezensionen

19. Juli 2024 1 reply
I was using another plugin which does a similar job but Speculative Loading appears to be substantially quicker. Using on about 10 sites and no issues. Thank you
27. Mai 2024
Es verkürzt die Ladzeit für einen Benutzer sichtbar, auch wenn im Hintergrund die Seite gleichschnell geladen wird, so fühlt es sich für einen Benutzer extrem schnell an.
8. Mai 2024 1 reply
I’ve currently activated this plugin on five sites, some on one server, and then others on another. The plugin has yet to present any plugin conflicts or other issues. The time to load pages is drastically improved based on user intent, and based on this alone, I cannot recommend this plugin enough. I haven’t tested the sites with Lighthouse, but honestly, I don’t feel the need to do that, because it’s about the user experience first, and that is such an improvement with this plugin. Thank you!
Lies alle 16 Rezensionen

Mitwirkende & Entwickler

„Speculative Loading“ ist Open-Source-Software. Folgende Menschen haben an diesem Plugin mitgewirkt:

Mitwirkende

„Speculative Loading“ wurde in 8 Sprachen übersetzt. Danke an die Übersetzerinnen und Übersetzer für ihre Mitwirkung.

Übersetze „Speculative Loading“ in deine Sprache.

Interessiert an der Entwicklung?

Durchstöbere den Code, sieh dir das SVN Repository an oder abonniere das Entwicklungsprotokoll per RSS.

Änderungsprotokoll

1.3.1

Bug Fixes

  • Check if rel contains nofollow instead of being just nofollow when excluding speculative loading. (1232)

1.3.0

Enhancements

  • Prevent speculatively loading links to the uploads, content, plugins, template, or stylesheet directories. (1167)
  • Facilitate embedding Speculative Loading in other plugins/themes. (1159)
  • Improve overall code quality with stricter static analysis checks. (775)
  • Bump minimum PHP requirement to 7.2. (1130)

1.2.2

Bug Fixes

  • Fix composition of href exclude paths to account for JSON encoding and differing site/home URLs. (1164)

Documentation

  • Update readme with browser support and FAQ section about analytics and personalization. (1155)

1.2.1

Enhancements

  • Add settings link to Speculative Loading plugin action links. (1145)
  • Bump minimum PHP version to 7.2. (1130)

Bug Fixes

  • Exclude _wpnonce URLs in speculation rules. (1143)
  • Exclude rel=nofollow links from prefetch/prerender. (1142)

1.2.0

  • Add missing uninstall.php to remove plugin’s database option. (1128)

1.1.0

  • Allow excluding URL patterns from prerendering or prefetching specifically. (1025)
  • Rename plugin to „Speculative Loading“. (1101)
  • Add Speculative Loading generator tag. (1102)
  • Bump minimum required WP version to 6.4. (1062)
  • Update tested WordPress version to 6.5. (1027)

1.0.1

  • Escape path prefix and restrict it to be a pathname in Speculation Rules. (951)
  • Force HTML5 script theme support when printing JSON script. (952)
  • Add icon and banner assets for plugin directory. (987)

1.0.0

  • Initial release of the Speculative Loading plugin as a standalone plugin. (733)