Priority Elements

In WP Rocket, the following assets of a page are the Priority Elements:


Overview

The process of optimizing the Priority Elements is automatic but not immediate, it's asynchronous, and follows these steps:

  1. A script called wpr-beacon.min.js needs to be injected to the page to optimize.
  2. When this script is executed with a visit, it will detect the Priority Elements and send them back to WP Rocket.
  3. WP Rocket will add the optimized markup on the next time the page is cached.

Recommendation! To make sure the whole process happens as automatic and as fast as possible, use the Remove Unused CSS option.

Therefore, your site should meet the Remove Unused CSS's basic requirements.


When to clear the Priority Elements

These elements are automatically purged in most scenarios, except:

  • When you have applied manual changes to the content, CSS and/or images of your pages.

In that case, you can use the Clear Priority Elements option in WP Rocket's top menu, to manually purge them, like this:

clear priority elements button

Or, if you're editing a specific page, you will see a Clear Priority Elements of this URL button in the top bar, like this:

clear priority elements for this url button

These actions will clear all types of Priority Elements.


Pre-warmup

To partially speed up the processing of pages, the Priority Elements use a pre-warmup system, which works as follows:

  • The first 10 URLs found in the mobile homepage will be sent to WP Rocket's SaaS.
  • The SaaS will open those links using real browser and the data will be generated by the script.
  • The SaaS will visit the URLs with ?wpr_imagedimensions=1&nowprocket=1&no_optimize=1 query string added.

Note: The rest of the pages of the site, which won't be processed by the pre-warmup, can still get the related optimizations as they receive visits.

Pre-warmup will not happen when:

  • Remove Unused CSS is enabled, because the URLs visited by the Used CSS generation SaaS will trigger the script, and generate the data automatically. Thus, the pre-warmup is not needed here.
  • The access to the ?wpr_imagedimensions=1&nowprocket=1&no_optimize=1 query string is blocked.
  • The WP_ENVIRONMENT_TYPE constant is set to local.
  • The license is expired for more than 15 days.

How to deactivate this feature

If you’re having issues, and you need to deactivate all the Priority Elements, you can install and activate the following helper plugin:

📥 Download (.zip): WP Rocket | Disable Priority Elements
Developers: You can find the code for this plugin on GitHub.

This helper plugin will deactivate the following:

If you're having problems with only one of the features, please refer to their specific articles to find the specific helper plugin you should use instead.


Technical details

  • The wpr-beacon.min.js script will only collect data after a visit was made with a browser with the following required dimensions:
    • Mobile devices with display area smaller than 393x830.
    • Desktop devices with display area bigger than 1600x700.

      Visits made outside the above dimensions are not valid. WP Rocket will consider that the type of device used is too large or too small, and the script will not be executed.
  • The wpr-beacon.min.js script can't be executed on headless browsers.
  • The Action Scheduler task called rocket_job_warmup, will be created to fetch the mobile homepage and send each of the 10 URLs to the pre-warmup process.

Asynchronous processing details

If Remove Unused CSS is not active on a site, or if a page is processed before Remove Unused CSS, the asynchronous processing of the elements, after the beacon script was added, happens as follows:

  1. For the script to be executed, and the process of detecting and retrieving data is successful, the type of visit made to the page needs to provide enough information about the elements to optimize.

    This type of valid visit happens when:

    • A real user visits the page with a browser within the required dimensions.
    • The page is processed by the Remove Unused CSS SaaS during Used CSS generation.
    • Or, if the Remove Unused CSS option is not active, a pre-warmup process will happen to execute the script for 10 of your site's pages.
  2. After the script is executed and the process of detecting the elements is completed, the cache needs to be cleared manually or automatically.

    After the cache is cleared at this point, the optimizations should finally be applied to the page.
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.