Mobile cache

The Mobile cache feature enables the serving of cached and optimized pages to visitors who are using a mobile device to navigate your website. This article includes some details of how the feature works, and other general instructions.

In this article

What does “mobile” mean for WP Rocket?

Usually the term “mobile device” would be used for smartphones as well as tablets, and every screen size in between. WP Rocket, by default, applies the term “mobile” to phones only. It does not consider tablets as “mobile” in the context of page caching. Mobile phones get detected by HTTP user agent.

Only phones, not tablets are treated as “mobile” by WP Rocket by default.
If you’re down with code, look at wp-rocket/inc/classes/dependencies/mobiledetect/mobiledetectlib/Mobile_Detect.php around line #360 for the complete set of user agents WP Rocket will detect.

Treat tablets as "mobile"

You can modify this default behavior to treat tablets as mobile with this helper plugin:

📥 Download (.zip): WP Rocket | Set Tablets As Mobile
Developers: you can find the code for this plugin on GitHub.

The helper can be useful if your theme or plugin uses the wp_is_mobile function, which treats tablets as mobile devices. Also, note that both the Enable caching for mobile devices option and Separate cache files for mobile devices sub-option must be enabled for the helper to work. More about those options below.

Should I enable cache for mobile devices?

Yes, as a rule of thumb, you should enable caching for mobile devices.

Don't enable mobile caching if your website is not responsive, i.e. does not adapt to and fit onto smaller screens automatically.

Note: If no mobile cache option is enabled, WP Rocket will not serve any cached documents to mobile devices. Visitors viewing your website on their phone will receive (slower) page views directly from the WordPress database.

What does “Separate cache files for mobile devices” mean?

When this option is enabled, WP Rocket will create a dedicated cache file for mobile devices for every document that gets cached. As a result, WP Rocket will serve an entirely different cache file to mobile phones than to tablets, or desktop computers.

This can be useful, or even necessary in case your site provides any features for mobile devices only, such as an additional navigational toolbar loaded via JavaScript. If WP Rocket would not create a dedicated file for that view, those mobile features could get cached and be visible on desktop devices as well—or the other way round: the desktop view would get cached and served to mobile devices as well, hence no mobile features would be visible.

If you use any of the following plugins, this option will be enabled by default (and you will see the checkbox in the settings "grayed out") :

If you visit the cache directory in wp-content/cache/wp-rocket/[example.com] (with example.com representing your domain), you will see 2 types of file names for each document:

  • index.html(_gzip) —cache files for tablets and desktop 
  • index-mobile.html(_gzip) —cache files for phones

Should I enable both mobile caching options?

Depending on how responsive your design is, you would either just enable the first option, or both options in case your site provides any features loaded only on mobile devices. 

Here’s a good rule of thumb on how to use these 2 options:

A
Do you have another layer of cache, like Varnish, NGINX etc? If so, it's safe to activate Enable caching for mobile devices, but Separate cache files for mobile devices may not be. You must first check if the other cache layer can distinguish between mobile visitors and desktop visitors (ask your host). If it cannot, use only Enable caching for mobile devices. If it can, proceed with the below.
B
Use the first option (Enable caching for mobile devices) alone if your design is fully responsive and scales up and down seamlessly.
🛠  WP Rocket will serve the same cache file for a page request that a tablet or desktop computer would receive.
C
Additionally enable the second option ( Separate cache files for mobile devices ) in case you use one of the plugins mentioned above or in the option’s description, or in case your site loads any resources on mobile devices only. 
🛠  WP Rocket will serve a separate cache file to phones, different to the one tablets and desktop computers would receive.

Themes requiring the use "Separate Cache for Mobile Devices"

Not sure what to do? 😰
When in doubt, always enable both options. This can result in twice as many cache files on your server, but it will in any case fit your needs, no matter how responsive your site is exactly.

Can separate mobile cache files be preloaded?

Yes. If you have enabled the Separate cache files for mobile devices option, mobile cache files will also be generated by preload in addition to desktop cache files.

Separate cache for mobile devices and 3rd party cache

When other caching layers are activated (server cache, DNS cache), they must be able to serve a separate cache for desktop and mobile in order for the feature to work.

Cloudflare Cache Everything

When using Cloudflare Cache Everything page rule, Cloudflare will cache whichever device version will come first, and will serve it to all following visits.

It needs to be turned off if it is mandatory to have a different cache version for mobile and desktop.

Cloudflare APO

When using Cloudflare APO at the same time as the "Separate Cache for Mobile Devices" option, make sure to enable Cloudflare APO's caching by device type. Here is where you can find it:
- The setting from the Cloudflare dashboard's APO card
- or from the WordPress plugin version 4.4.0 or later
This will force Cloudflare APO to cache and serve the right version of the page.

Varnish

By default, Varnish stores and serves the same cache for both desktop and mobile.

An additional configuration is required to help Varnish distinguish between different types of cache.

The following additional customization for the default.vcl is a good starting point.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.