19 Ways To Improve Mobile Speed In WordPress For Better Scores In Web Vitals

Need to improve WordPress mobile speed and core web vitals?

Most speed optimizations carry over to mobile, so start with the basics first: hosting, theme, cache plugin, CDN, and finding slow plugins in Query Monitor. All have a large impact on core web vitals for both desktop/mobile and I listed recommendations later in this tutorial. I like Rocket.net with Cloudflare Enterprise + Gutenberg (i.e. GeneratePress/Blocksy) + FlyingPress. Although the LiteSpeed setup is also good (LiteSpeed server + LiteSpeed Cache + QUIC.cloud).

But let’s get to the mobile-specific optimizations. Some CDNs serve smaller images to mobile (Cloudflare Mirage and BunnyCDN are two while RocketCDN doesn’t do this). You can also use an adaptive images plugin. Perfmatters has an option to disable specific plugins/CSS/JS on mobile. Then there’s mobile caching in WP Rocket, using a “load more comments” button on mobile, and reducing network latency by using a fast DNS (Cloudflare) and higher TLS versions.

No worries, I’ll cover all this in more detail. Just remember: Google uses mobile-first indexing, so mobile speed is more important than ever, especially if most your visitors use their phones.

 

1. Test Mobile Speed In Think With Google

Think With Google is the best way to test mobile speed since it uses a 4G connection. Run your website through it, enter your email address, and Google will send you the full report in a PDF. PageSpeed Insights gives similar recommendations but uses a slower 3G connection for the mobile test. This means your WordPress site will almost always load faster on the desktop test.

Google Search Console has a core web vitals report with a mobile-specific tab that shows all URLs that are affected. However, the recommendations in Think With Google are more specific.

GTmetrix Pro users can test their website on Android, but it’s limited to Vancouver. Since GTmetrix uses the same recommendations from PageSpeed Insights, it’s somewhat pointless. Google Analytics shows each page’s mobile load time under Behavior > Site Speed, then add a segment for mobile and tablet traffic. But like I already said, I would stick to Think With Google.

 

2. Resize Images For Mobile

Phones and tables have smaller screens, so smaller images should be served.

Not all image optimization plugins/CDNs resize images for mobile (RocketCDN and SiteGround Optimizer don’t while Cloudflare Mirage and BunnyCDN (including FlyingPress’ FlyingCDN) do. You can also use an adaptive images plugin (ShortPixel Adaptive Images is one popular choice). Otherwise, you’ll see a recommendation to properly size images when testing your mobile site.

 

3. Reduce Network Latency

There’s usually more latency on mobile networks. This can be improved with a CDN, faster DNS, and TCP settings.

Make sure you’re using a fast DNS on dnsperf.com (I recommend Cloudflare’s which is consistently in the top 5 results, is free, and can be used simply by changing nameservers).

In your Cloudflare SSL/TLS settings, make sure TLS 1.3 is enabled and set the minimum TLS version to 1.2. You may also need to set the minimum TLS version in your hosting account. Cloudflare Pro also has features like TCP Turbo and custom certificates that can help with this.

 

4. Remove Unused Mobile Assets

Perfmatters can disable CSS, JS, and entire plugins by device. This means if you have certain plugins that don’t need to load on mobile, you can reduce CSS/JS which affects several items in PageSpeed Insights. However, it can only be used if you have separate mobile caching enabled.

You can also remove certain content on mobile using responsive editors.

And if you’re using Elementor, remember to activate the following settings in the Experiments tab which can improve PageSpeed items related to DOM elements, CSS, JavaScript, and fonts.

Also make sure you’re not using unnecessary columns + widgets when creating your pages. If you’re using Elementor, here’s a great video on simplifying layouts with less columns + widgets.

 

5. Fix Mobile Layout Shifts

Use Google’s Layout Shift Debugger to find mobile layouts shifts. Your score should ideally be under .01 like Google recommends. Layout shifts are often caused by fonts, images or iframes without specified dimensions, animations, or asynchronous CSS which can often cause FOUC.

• Turn off “optimize CSS delivery” in WP Rocket.
• Turn off “load CSS asynchronously” in LiteSpeed Cache.
• Turn on “add missing image dimensions” in WP Rocket or LiteSpeed.
• Fix animation layout shifts with CSS transform + translate properties.
• Add placeholders for dynamic content (like AdSense) so they don’t shift around.

 

6. Enable Mobile Caching

Many cache plugins have an option for mobile caching.

If your cache plugin doesn’t support mobile caching, you may want to switch to one that does. Separate cache files for mobile devices caches mobile-specific elements and should usually only be on if you’re using a mobile plugin (WP Touch, WP Mobile Detect, JetPack mobile theme). Or if you’re using LiteSpeed Cache, it should be on if guest mode and guest optimization are on.

 

7. Hard Code Your Header, Footer, Sidebar

Elementor and Divi are slow (yep, even on mobile).

They add extra CSS, JavaScript, and fonts to both your desktop/mobile site. The best thing would be to use Gutenberg (GeneratePress, Kadence, Blocksy) or Oxygen. But if you need to keep your page builder, you should at least code your header, footer, and sidebar in CSS so it doesn’t use bloated code from page builders, since these will appear across the entire website.

I hired WP Johnny to do this and it made an enormous difference. He eventually removed Elementor completely and replaced it with Gutenberg, but started by coding these in CSS. He’s pricey and busy, so you may want to search for a developer on freelancer.com or upwork.com.

 

8. Downgrade Image Quality On Slow Connections

Some image optimization plugins (like Optimole) can downgrade image quality when visitors are on a slow connection. If the connection is slow, this downgrades the image quality to a whopping 40% compression level. Load times or image quality – which’s one more important?

Mirage also does this if you’re using Cloudflare Pro.

 

9. Add A “Load More Comments” Button On Mobile

If posts have lots of comments, break them up or use a “load more comments” button.

I chose to break comments in the WordPress discussion settings (I previously used wpDiscuz and delayed comments, but they jumped around which was annoying). If you use FlyingPress, just add #comments to the “Lazy Render HTML Elements” field. You can also try the Load More Anything or Lazy Load for Comments plugins, or wpDiscuz also lets you add a load more button.

 

10. Use A Cache Plugin That Better Addresses Web Vitals

FlyingPress and LiteSpeed Cache address core web vitals better than WP Rocket and SiteGround Optimizer.

WP Rocket optimizes for scores but not so much for browsing speed. RocketCDN (StackPath) has a slow Tbps with no other features outside of serving files from the CDN (it doesn’t resize images for mobile either). SG Optimizer lacks even more optimizations in core web vitals with constant compatibility issues they blame on third-party themes/plugins. Nitropack is blackhat because it moves things off the main-thread to cheat scores without improving load time much.

Just telling it how it is. I’d stick to FlyingPress or LiteSpeed Cache. My cache plugin guides cover the settings for every major cache plugin.

	SG Optimizer	WP Rocket	FlyingPress
Server-side caching	✓	x	x
Delay JavaScript	x	✓	✓
Remove unused CSS	x	Inline	Separate file
Critical CSS	x	✓	✓
Preload critical images	x	x	By number
Exclude above the fold images	By class	By URL	By number
Lazy load background images	x	Inline	Helper class
Fetchpriority resource hint	x	x	✓
Lazy render HTML elements	x	x	✓
Add missing image dimensions	x	✓	✓
YouTube iframe preview image	x	✓	✓
Self-host YouTube placeholder	x	x	✓
Host fonts locally	x	x	✓
Font-display: swap	x	✓	✓
Preload links	x	✓	✓
CDN (beyond Cloudflare)	SiteGround CDN	StackPath	BunnyCDN
CDN PoPs	14	60	93
CDN Tbps	N/A	65	80
Dynamic caching	✓	x	x
CDN geo-replication	x	x	✓
CDN image optimization	✓	x	✓
CDN image resizing for mobile	x	x	✓
Documented APO compatibility	x	x	✓

 

11. Try Full Page Cache, Object Cache, OPcache

Caching is great for desktop and mobile, just don’t forget there are many types of caching outside of cache plugins.

Full Page Cache – caches HTML and improves TTFB in multiple global locations when testing your website in KeyCDN’s performance test. Cloudflare APO is probably the most popular but there’s also Super Page Cache for Cloudflare and FlyingProxy which includes full page caching. There’s also full page caching in SiteGround Optimizer, but I don’t recommend using this plugin.

Object Cache – Redis or memcached are usually offered by your host and you’ll need to Google their instructions. In cPanel, they can be activated under PHP Extensions. Some cache plugins like LiteSpeed Cache and W3TC have settings to integrate object cache. There are also several Redis plugins to do this. Cloudways has Redis Object Cache Pro which can be activated in your account and it will be installed as a drop-in plugin. Since there are many different methods for installing Redis or memcached, you need to find your host’s instructions. I personally use Redis.

OPcache – OPcache is primarily good for PHP performance and CPU utilization. Again, you’ll need to Google your host’s instructions (screenshots shown above and below are for cPanel).

 

12. Manually Check Your Site’s Responsiveness

Just because you’re using a responsive theme doesn’t mean your website is responsive.

You need to manually check your website in a responsive design checker and make sure everything formats nicely. If you’ve never done this, you may be surprised what you’ll find.

Device-based caching is a feature included in some CDNs. It lets you cache specific elements based on the user’s device, but this should only be used if your WordPress site isn’t responsive.

• Cloudflare device-based caching instructions
• StackPath device-based caching instructions
• KeyCDN device-based caching instructions

 

13. Fix Mobile Redirect Errors

If you see redirect errors in PageSpeed Insights, it’s probably because:

• You changed to HTTPS or WWW and didn’t update links.
• You setup Page Rules in Cloudflare with forwarding URLs.
• Badly coded or incorrectly configured plugins are causing redirects.
• Cloudflare SSL options are incompatible with your server configuration (see tutorial).

If using Cloudflare, you can use their mobile redirect option which they say “automatically redirects mobile device visitors to a mobile-optimized subdomain. The redirect is done at the edge of Cloudflare’s network, improving load time by eliminating a roundtrip to the origin server – this is especially valuable on mobile networks, which serves content slower than wifi.”

Setup Redirects At Server Level
If you have a mobile subdomain (or any redirect for that matter), it’s best to setup it up at a server level so it doesn’t hit WordPress. Server-level redirects are faster than redirect plugins.

 

14. Don’t Use AMP

AMP (accelerated mobile pages) make mobile pages faster while giving you an AMP icon in mobile search results. But, AMP completely changes the design of your mobile WordPress site.

Kinsta’s conversions dropped 59% with AMP and they reverted to normal mobile pages. I also stopped using it since the design doesn’t look great. There are AMP plugins to help with design, but it’s still limited and you may be disappointed. And if you decide to add AMP then remove it, it’s extra work since you’ll need to setup redirects back to the old URLs. AMP isn’t worth it IMO.

 

15. Stop Using Mainstream Hosts And Get A <200ms TTFB

Rocket.net with their free Cloudflare Enterprise will outperform any “mainstream host” since you get 32 CPU cores + 128GB RAM, NVMe storage, Redis, and Cloudflare’s full page caching + Argo Smart Routing. I use them and average a <150ms global TTFB (or click through my posts).

Mainstream hosts (like SiteGround, Hostinger, and WPX) don’t have a lot of CPU/RAM, use slower SATA SSDs, and are shared hosting with strict CPU limits which force you to upgrade plans. Cloud hosting is faster, but Kinsta still uses SATA SSDs with low CPU/RAM, PHP workers, and monthly visits (Redis also costs $100/month). Cloudways Vultr HF is who I previously used, but again, they start with only 1 CPU + 1GB RAM on slower Apache servers, PHP-FPM, and GZIP.

Here are Rocket.net’s:

All plans use 32 CPU cores + 128GB RAM with NVMe (faster than SATA), Redis (better than memcached), LiteSpeed’s PHP, and Brotli (smaller compression than GZIP). They have no PHP worker limits since only about 10% of traffic hits your origin due to their Cloudflare Enterprise.

	SiteGround	Hostinger	Kinsta	Cloudways Vultr HF	Rocket.net
Hosting type	Shared	Shared	Cloud	Cloud	Private cloud
Storage	SATA	SATA	SATA	NVMe	NVMe
CPU cores	Not listed	1-2	12	1	32
RAM (GB)	Not listed	.768 – 1.536	8	1	128
Object cache	Memcached	x	Redis ($100/mo)	Redis (Pro)	Redis
Server	Nginx	LiteSpeed	Nginx	Apache	Nginx
PHP processing	FastCGI	LiteSpeed	FastCGI	FPM	LiteSpeed
Compression	Brotli	Brotli	Brotli	GZIP	Brotli
CPU limits	Very common	Low memory	PHP workers	Average	None

 
Why you need Cloudflare Enterprise

Because you get Enterprise features like 270+ PoPs, prioritized routing, full page caching, HTTP/3, WAF, and image optimization. 3 problems with most CDNs are their small network (PoPs) and no full page caching or image optimization. For example, WP Rocket’s RocketCDN uses StackPath which was removed from cdnperf.com and doesn’t include image optimization with a mediocre Tbps speed of 65+. SiteGround’s CDN only has 14 PoPs. QUIC.cloud CDN (for LiteSpeed) and BunnyCDN are good, but they still don’t beat Cloudflare Enterprise. Sure, you can pay $5/mo for Cloudflare’s APO, but you’re still missing out on all other Enterprise features.

3 popular hosts with Cloudflare Enterprise

Rocket.net’s Cloudflare Enterprise is free, setup automatically, and uses full page caching (unlike Cloudways). And unlike Kinsta’s, Rocket.net has Argo Smart Routing (specifically good for WooCommerce sites), load balancing, and image optimization. Rocket.net CEO Ben Gabler also used to be StackPath’s Chief Product Officer and went as far as building Rocket.net’s data centers in the same locations as Cloudflare’s. And unlike both hosts, Rocket.net doesn’t limit PHP workers (there’s no CPU limits) and monthly visit limits are 10-25 times more than Kinsta’s.

	Cloudflare Enterprise (Kinsta)	Cloudflare Enterprise (Cloudways)	Cloudflare Enterprise (Rocket.net)
CDN PoPs	270	270	270
Prioritized routing	✓	✓	✓
Full page caching	✓	x	✓
HTTP/3	✓	✓	✓
WAF	✓	✓	✓
Argo smart routing	x	✓	✓
Load balancing	x	✓	✓
Image optimization	x	✓	✓
Automatic configuration	x	x	✓
Price	Free	$5/mo (1 domain)	Free

 
Problems with mainstream hosts

I’ve written some pretty bad reviews about SiteGround’s slow TTFB, CPU limits, and why SG Optimizer does a poor job with core web vitals (they also control several Facebook Groups and threaten to sue people who write bad reviews). Hostinger writes fake reviews and is only cheap because you get less resources like CPU/RAM. Kinsta and WP Engine are way too expensive for how many resources, PHP workers, and monthly visits you get. Along with major incidents like WPX’s worldwide outage and SiteGround’s DNS getting blocked by Google for 4 days (both WPX and SiteGround denied responsibility). One thing is clear: most mainstream hosts appear to be more interested in profits than performance. Please do your own research before getting advice.

Getting started

Step 1: Create a Rocket.net account and you’ll be prompted to add a coupon. Sign up with coupon OMM1 to get your first month for $1 (renews at $30/mo or $25/mo when paying yearly). If you sign up with my coupon or affiliate links, I get a commission which I seriously appreciate.

Step 2: Request a free migration. They did this the same day and let me review my website before it was launched with no downtime. For the record, their support is better than Kinsta’s and you can reach out to Ben Gabler or his team (via phone/chat/email) if you have questions.

Step 3: Upgrade to PHP 8.1 and ask support to install Redis (they use Redis Object Cache). These are the only things I did since Cloudflare Enterprise and backups are both automatic.

Step 4: Retest your TTFB in SpeedVitals and click through your pages to see the difference. You can also search their TrustPilot profile for people mentioning “TTFB” where they’re rated 4.9/5.

I was previously on Cloudways Vultr HF which was great, but their Cloudflare Enterprise doesn’t use full page caching (yet) and is $5/mo with annoying challenge pages. Even if their Cloudflare Enterprise was identical, Rocket.net still outperforms them with better specs like more CPU/RAM, Brotli, and LiteSpeed’s PHP (plus better support, easier to use, and usually pricing). While Cloudways is a big improvement than most hosts, you’re already spending $18/mo for Vultr HF’s lowest 1 CPU plan with Cloudflare Enterprise. At that point, the extra $7/mo you’d be spending at Rocket.net is worth it. Rocket.net’s dashboard is also much easier.

For small sites on a budget, NameHero’s Turbo Cloud plan is similar to Hostinger between LiteSpeed, cPanel, and pricing. However, NameHero’s Turbo Cloud plan has about 1.5x more resources (3 CPU + 3GB RAM) with NVMe storage. NameHero’s support/uptimes are also better shown in TrustPilot reviews. This is one the fastest setups on a budget… you get a LiteSpeed server + LiteSpeed Cache + QUIC.cloud CDN, and email hosting. The main con is their data centers are only in the US and Netherlands. If these aren’t close to your visitors, make sure to setup QUIC.cloud’s CDN which has HTML caching (ideally the paid plan which uses all 70 PoPs).

 

17. Optimize Plugins

Think plugins don’t slow down your mobile website too? Check your website’s Chrome Dev Tools coverage report and look for plugins (as well as other files) with heavy CSS/JavaScript.

 

18. Use PHP 8

PHP 8 handles more requests per second compared to older versions.

 

19. Optimize CSS/JavaScript

There are many items in PageSpeed Insights related to CSS/JavaScript (check your Chrome Dev Tools coverage report shown in step 17).

“Use lightweight themes/plugins” is a generic recommendation, but it’s so much easier to start at the source. You can defer/delay JavaScript, use critical CSS, and unload assets in Perfmatters.

Third-party code is another big one which can add lots of JavaScript code. Some third-party code can be hosted locally (fonts, analytics, YouTube thumbnails). Other third-party code can be delayed in your cache plugin, while CDN URLs and third-party fonts can use the preconnect resource hint. Videos can be lazy loaded, you can use local avatars for comments, and so forth.

View your recommendations and research how to fix it! I have lots of core web vitals tutorials.

 

Frequently Asked Questions

How do I test my website's mobile speed?

Think With Google uses a 4G connection to test your website's mobile speed and includes recommendations that can improve core web vitals.

Why is my WordPress mobile website slow?

It may be from heavy JavaScript caused by plugins, page builders, and third-party code. It can also be from non-responsive images, lack of mobile caching, sliders, and a slow TTFB.

Why is my PageSpeed Insights mobile score low?

PageSpeed Insights uses a slow 3G connection to test your mobile website. Combine this with throttling and this is often why websites have better scores on desktop than mobile.

Which WordPress plugins improve mobile speed?

Adaptive images, a cache plugin that better address core web vitals, and Optimole are 3 WordPress plugins that can improve mobile speed.

Should I use accelerated mobile pages?

Most people in Facebook Groups recommend against AMP because it changes your design and can be difficult to get working properly. Kinsta reported their conversions dropped 59% after using AMP and ultimately decided to disable it.

Cheers,
Tom