The WordPress Core Performance Team has released two plugins that enhance webpage speed using new technologies. These plugins pre-render URLs before users click on a link and accelerate lazy-loaded images.
WordPress Core Performance Team
The WordPress Core Performance Team is tasked with coordinating with various WordPress core development teams to improve performance and undertake projects that directly enhance the core performance of WordPress.
The initial plan for the Performance Team included:
- Leading the formation of working groups
- Coordinating initial administrative tasks (such as managing Slack channels, scheduling weekly meetings, and nominating representatives for working groups)
- Creating a mission statement for the team
- Identifying focus areas
- Outlining the scope and roadmap
WordPress Performance Plugins
Performance improvements to WordPress are often tested in plugins before being integrated into future versions of WordPress. Users who download these plugins get to experience webpage speed enhancements first-hand and are encouraged to provide feedback on their performance, both positive and negative.
The most popular plugin released by the Performance Team is the Performance Lab plugin, which features five modules that can be toggled on or off based on user needs.
The current modules of the Performance Lab plugin include:
- Dominant Color Images:
Stores the dominant color of newly uploaded images and creates a placeholder background with that color. - WebP Support Health Check:
Adds a WebP support check in Site Health status. - WebP Uploads:
Creates WebP versions for new JPEG image uploads if supported by the server. - Enqueued Assets Health Check:
Adds a CSS and JS resource check in Site Health status. - Autoloaded Options Health Check:
Adds a check for autoloaded options in Site Health status.
Two New Performance Plugins
The two newly announced plugins are:
- Auto-sizes for Lazy-loaded Images
- Speculation Rules
These plugins enhance performance in distinct ways, allowing them to be used together for maximum improvement.
New WordPress Auto-Sizes Plugin
Lazy-loading defers the loading of non-critical images to enhance page loading times. Essential images for the visible part of the webpage load first, while others load as the user scrolls down.
This plugin integrates a new lazy loading HTML attribute, sizes=”auto,” which sets the “sizes” attribute to “auto” for lazy-loaded images using ‘srcset,’ thereby speeding up the download of images as they’re needed when the user scrolls down the page.
Though the sizes=”auto” attribute for images is part of the responsive images specification in HTML, it is not specifically related to lazy-loading. Instead, the sizes attribute, when used with srcset, provides the browser with the image size dimensions needed for different viewport sizes, allowing the browser to select the most appropriate image source from the srcset.
New WordPress Speculation Rules Plugin
The Speculation Rules plugin uses the Speculation Rules API to prefetch resources of pages a user is likely to request. Essentially, it predicts that a page will be requested and starts pre-rendering the webpage before the user clicks a link.
The official plugin description states:
“Uses the Speculation Rules API to prerender linked URLs upon hover by default.”
The Speculation Rules API aims to enhance web browsing performance by allowing web pages to provide hints to the browser about potential links a user might click. The browser can then prefetch or pre-render resources based on the likelihood of a user navigating to a new webpage.
The Mozilla developer page explains:
“The Speculation Rules API is designed to improve performance for future navigations. It targets document URLs in multi-page applications (MPAs) rather than single-page applications (SPAs).
The API provides an alternative to the <link rel=’prefetch’> feature and supersedes the deprecated <link rel=’prerender’> feature in Chrome. It offers many improvements and a more expressive syntax for specifying which documents should be prefetched or prerendered.”
The plugin requires Chrome 121 or higher. Users with browsers that do not support the Speculation Rules API will experience no change; pages will render as usual.
According to the plugin documentation:
“The plugin is configured by default to prerender WordPress frontend URLs when the user hovers over a link. This can be customized via the ‘Speculation Rules’ section under Settings > Reading.
A filter can be used to exclude specific URL paths from being eligible for prefetching and prerendering (see FAQ section). Alternatively, adding the ‘no-prerender’ CSS class to any link (
<a>tag) will prevent it from being prerendered.”
Featured Image by Shutterstock/Haali
