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.
- Test mobile speed in Think With Google
- Resize images for mobile
- Reduce network latency
- Remove unused mobile assets
- Fix mobile layout shifts
- Enable mobile caching
- Hard code your header, footer, sidebar
- Downgrade image quality on slow connections
- Add a “load more comments” button on mobile
- Use a cache plugin that better addresses web vitals
- Try full page cache, object cache, OPcache
- Manually check your site’s responsiveness
- Fix mobile redirect errors
- Don’t use AMP
- Stop using garbage mainstream hosts
- Use a performant CDN
- Optimize plugins
- Use PHP 8
- Optimize CSS/JavaScript
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 | 176 | 60 | 114 |
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 Garbage Mainstream Hosts
In 2019, I moved from SiteGround to Cloudways Vultr HF and posted my results. In 2022, I moved to Rocket.net with Cloudflare Enterprise which landed me a <100ms global TTFB in KeyCDN. They’re the fastest host I’ve used in 12 years and are blowing up in Facebook groups.
If you have a poor TTFB, you need to rethink your host/CDN since those are the 2 main TTFB factors (which is also 40% of LCP). After writing bad reviews of SiteGround, Hostinger, Kinsta, and EIG, I think we can agree most hosting reviews are garbage. A good place to get unbiased feedback is the WP Speed Matters Group (run by Gijo from FlyingPress). Rocket.net doesn’t do aggressive marketing so not as many people know about them, but results are all I care about.
Good hosting plans:
FastComet FastCloud Extra | NameHero Turbo Cloud | Cloudways Vultr HF (2GB) | Servebolt Pro | Rocket.net Starter | |
---|---|---|---|---|---|
Type | Shared | Shared | Cloud | Cloud | Cloud |
Server | LiteSpeed | LiteSpeed | Apache + Nginx | Apache + Nginx | Apache + Nginx |
Cores/RAM | 6 cores/3GB | 3 cores/3GB | 1 core/2GB | Unmetered | 32 cores/128GB |
Storage | 35GB / SATA | Unlimited NVMe | 64GB / NVMe | 4GB / NVMe | 10GB / NVMe |
CDN | QUIC.cloud | QUIC.cloud | Cloudflare Enterprise ($5/mo) | Cloudflare Enterprise ($299/mo) | Cloudflare Enterprise (free) |
CDN PoPs | 80 | 80 | 285 | 285 | 285 |
Full page caching | ✓ | ✓ | ✓ | ✓ | ✓ |
CDN image optimization | via QUIC | via QUIC | Mirage/Polish | Mirage/Polish | Mirage/Polish |
DNS | Use QUIC | Use QUIC | DNS Made Easy ($5/mo) | x | Cloudflare |
Cache plugin | LiteSpeed Cache | LiteSpeed Cache | x | Servebolt plugin | x |
Object cache | Memcached | Redis | Redis Pro | x | Redis |
PHP processor | LiteSpeed | LiteSpeed | FPM | Apache 2 ITK MPM | LiteSpeed |
Database | MySQL | MariaDB | MariaDB | MariaDB | MariaDB |
Bandwidth or monthly visits | 92GB + 100k (est.) | 50k (est.) | 2TB | 1M dynamic requests | 50GB + 250k visits/mo |
Control panel | cPanel | cPanel | Custom | Custom | Custom |
Email hosting | ✓ | ✓ | x | x | x |
Major incidents | 2022 DDoS attack | 2011 2-day node outage | None | None | None |
Migrations | 3 free | 1 free | 1 free + $25/site | Unlimited free | Unlimited free |
TrustPilot rating | 4.9/5 | 4.6/5 | 4.5/5 | 4.5/5 | 4.9/5 |
Monthly price | $5.49 (1-3 years) | $9.98 (3 years) | $30 | $99 | $25 (1 year) |
- Shared LiteSpeed Hosting – FastCloud Extra, Turbo Cloud, and ChemiCloud’s WordPress Turbo plan are all shared LiteSpeed hosting with cPanel and good alternatives to SiteGround & Hostinger. NameHero and ChemiCloud have less cores/RAM but use NVMe (faster than SATA), Redis (faster than Memcached), and MariaDB (faster than MySQL). NameHero’s data centers are only in US & EU, and NameHero/ChemiCloud make you sign up for 3 years to get their cheapest intro price (FastComet is 1-3 years). With either of these, you’ll use the free LiteSpeed Cache plugin and QUIC.cloud’s CDN (great setup). For cloud VPS, Scala is a solid host and doesn’t charge for the LiteSpeed license separately like other VPS hosts. Imunify360 is used as a security suite on FastComet, NameHero, and Rocket.net.
- Cloudways Vultr HF – good starting point for cloud hosting with more storage + bandwidth than Rocket.net, but their Cloudflare Enterprise needs APO and serves too many challenge pages. They were acquired by DigitalOcean who raised prices, and support could be better. Still very fast between Vultr HF, NVMe, Redis Object Cache Pro, and MariaDB. Even without APO, Cloudflare Enterprise is a powerhouse for reducing TTFB with Argo Smart Routing and prioritizing routing. Mirage/Polish optimize images better than most plugins and doesn’t tax your server. Cloudflare Enterprise can also mean 3 less plugins between image, CDN, and security plugins.
- Servebolt – incredibly fast servers, but Cloudflare Enterprise costs $299/mo via accelerated domains, so you’ll probably just add APO using the Cloudflare plugin. However, this is a disadvantage (specifically for WooCommerce sites) because you don’t get Argo Smart Routing, and Redis is only available on the Business plan and up (Rocket.net includes both). This and low storage are the main cons but they’re much faster than Kinsta + WP Engine. They also have a Servebolt Optimizer plugin.
- Rocket.net – only host I know that averages a <100ms global TTFB. Both their hosting and Cloudflare Enterprise have better specs. For hosting, you get more CPU cores/RAM, LiteSpeed’s PHP, NVMe, Redis, and MariaDB. For their Cloudflare Enterprise, it’s free with APO, Argo, prioritized routing, Mirage/Polish, Brotli, early hints, and Enterprise WAF. Support is also A+ (talk to Ben Gabler and his team) or watch the interview I did with him. Unlike Kinsta and WP Engine, they don’t limit PHP workers, have a 1GB memory limit, and use Redis Object Cache Pro on their business plan and up with 10x more monthly visits and unlimited free migrations. The main con is only 50GB bandwidth on the Starter plan with 10GB NVMe storage. Search their TrustPilot reviews for “TTFB” or search Facebook Groups for feedback about them. You can get $1 your first month when you checkout using code OMM1
Bad hosting plans (and bad hosts in general):
SiteGround GrowBig | Hostinger Business WP | Bluehost Choice Plus | WP Engine Startup | Kinsta Starter | |
---|---|---|---|---|---|
Type | Shared | Shared | Shared | Cloud | Cloud |
Server | Apache + Nginx | LiteSpeed | Apache + Nginx | Apache + Nginx | Apache + Nginx |
Cores/RAM | Not listed | 2 cores/1.5GB | Not listed | Not listed | 12 cores/8GB |
Storage | 20GB / SATA | 200GB / SATA | 40GB / SATA | 10GB / SATA | 10GB / SATA |
CDN | Google Cloud | QUIC.cloud | Cloudflare free | Cloudflare free + Polish | Cloudflare APO + firewall rules |
CDN PoPs | 176 | 80 | 285 | 285 | 285 |
Full page caching | via CDN | via QUIC | x | x | ✓ |
CDN image optimization | Very limited | via QUIC | x | Polish only | x |
DNS | Blocked by Google for 4 days | Use QUIC | Internal | Internal | Amazon Route 53 |
Cache plugin | SG Optimizer | LSC | x | x | x |
Object cache | Memcached | Memcached | x | Memcached | Redis ($100/mo) |
PHP processor | FastCGI | LiteSpeed | FastCGI | Not listed | FastCGI |
Database | MySQL | MySQL | MySQL | Not listed | MySQL |
Resource limits | CPU limits are common | Low resources | Low resources | Low PHP workers + 25k visits/mo | 2 PHP workers + 25k visits/mo |
Inodes | 400k | 600k | 50k | Unlimited | Unlimited |
Control panel | Site Tools | hPanel | cPanel | User Portal | MyKinsta |
Email storage | 10GB | 1GB | Adjustable | x | x |
Major incidents | Denies issues with TTFB, DNS, CPU, others | Scam reports, fake reviews, 2019 breach | Claims of hosting terrorist sites | 2015 breach | None |
Migrations | $30/site | Unlimited (but screws it up) | Free on qualified accounts only | Paid (quoted) | Free on select hosts + 1 free |
TrustPilot rating | 4.6/5 | 4.6/5 (fake) | 3.7/5 | 4.5/5 | 4.2/5 |
Monthly price | $3.99 (1 year) | $3.99 (2 years) | $5.45 (1 year) | $20 (1 year) | $29 (1 year) |
Renewals | $24.99/mo | $14.99/mo | $19.99/mo | $25/mo | $29/mo |
- SiteGround – $25/mo for a shared GrowBig plan is a ripoff. Top it off with a poor cache plugin, inferior CDN than Cloudflare APO, CPU limits, and a support team that constantly lies about their issues… means you’re getting ripped off. If your LCP is high, I bet you use SiteGround Optimizer which does a poor job with web vitals, plus they’ve have TTFB issues. Their CDN requires you to use SiteGround’s DNS which was blocked by Google for 4 days. To cover up their mess, they deny everything and use Facebook group admins (who run several groups) to promote SiteGround on their behalf and act like support agents. They have “good reviews” only because of affiliates and legal threats. Check this thread about Hristo’s AMA.
- Hostinger – only cheap because they lack resources like cores, RAM, and email storage. Everyone gets drawn to their cheap prices and LiteSpeed, but have you read their scam reports and fake reviews? I would never trust them with my site. Support is horrendous and will screw up migrations, suspend your account, and pretty sure they outsource it to an ice cream truck in Lithuania. The CEO admitted to fake reviews, they’re banned from Facebook groups for voting for themselves in polls, and hired brand ambassadors who pretend to be customers. Check this poll.
- Bluehost – another host that grew from “how to start a blog” affiliates and pays WordPress to be “officially” recommended. Use a shared LiteSpeed host instead.
- WPX – no redundancy system which already lead to a global outage they blamed on a dead CEO. Ticking time bomb, overpriced shared hosting, and not the fastest WordPress host like Matthew said (but now he lists Kinsta #1)? Marketing gimmick.
- WP Engine – I reached out to them about their specs, but they don’t give them out. When a host doesn’t list basic things like cores/RAM, I assume it’s not good. From my experience, they’re similar to Kinsta but even worse with pricey overages.
- Kinsta – great option if you want to go bankrupt with paid add-ons that should be free. Compared to Rocket.net, you get 16x less RAM, 10x less monthly visits, brutal PHP worker limits, and a very low memory limit of 256MB. What are you paying so much for? Slower SATA SSDs, a premium DNS that’s slower than Cloudflare’s, and staging sites that get 1 CPU core? Madness! No wonder their TrustPilot rating sunk.
I agree:
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.
- Avoid high CPU plugins: avoid this list of 75 slow plugins and use Query Monitor, WP Hive, and the Chrome Dev Tools coverage report to find your slowest plugins.
- Replace high CPU plugins with faster plugins: research is required, but worth it.
- Remove unused plugin tables in your database: use WP-Optimize to remove tables left behind by old plugins in your database. You might also find certain plugin features/modules adding lots of database overhead, so reconsider these.
- Disable plugins on mobile: use Perfmatters to disable certain plugins on mobile.
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