Is your WordPress website loading slowly? The problem usually isn’t your hosting plan or a missing caching plugin.

I’ll walk you through practical optimizations that address the actual causes of slow loading, especially on mobile connections. These tips work with any theme or builder and deliver a real difference in user experience.

How to Actually Measure Performance

You can use PageSpeed Insights, GTmetrix, and GiftOfSpeed to benchmark your site. These tools highlight issues and track improvements over time, so they’re great for generating a baseline.

While Core Web Vitals matter for technical measurement, you should also look at the actual human experience. A site can hit 90/100 on PageSpeed Insights while still feeling sluggish to real users. The metrics that matter most are the ones that reflect actual human experience, not algorithmic grading.

Measuring Actual Performance with Chrome DevTools

The most reliable way to check your site is by simulating real-world conditions. You can do this easily using Chrome DevTools.

Here’s exactly how I test every site (you can follow this same process):

• Open your site in Chrome and press F12 to open DevTools.
• Click the Network tab and select “Slow 4G” from the throttling dropdown. Then, click the checkbox to disable cache.
• Hard refresh the page (Ctrl+Shift+R).

This reveals what real visitors actually experience. It will show you how long they stare at a blank screen, when content appears, and whether images pop in smoothly or cause the page to jump around.

Prefer watching over reading? Here’s a video walkthrough that shows these performance measurement techniques in action.

How to Speed Up Your WordPress Website

Let me show you these optimizations in action using a real example. I’m working with a fairly image-heavy landing page built with Oxygen, which already eliminates much of the bloat found in traditional themes and page builders.

The site runs on Cloudways with no compression, caching, or CDN enabled. 

Here are the server configurations:

• Plan Name: Small+
• RAM: 2GB 
• CPU: 2 Core Processor
• Disk: 60 GB NVMe Storage
• Bandwidth: 3 TB

Before I begin sharing the tips, let’s run the page through the page speed tools I mentioned before, as well as check how it performs for users with slower internet connections.

Here’s how it performs on PageSpeed Insights:

GTmetrix score:

And here’s how it loads in a real-world scenario. 

This will give us a clean baseline to demonstrate what each optimization actually accomplishes and how much impact it makes on real-world experience.

As you can see, the page loads frame by frame, which feels broken to real visitors. You can see the layout jump around while the image is still loading. This gap between decent test scores and actual user frustration is exactly what we’re fixing.

Let’s start with the optimization.

1. Optimize and Compress Images

Most well-designed sites often serve images that are 3-4 times larger than necessary. Large image files are the most common performance bottleneck, and fixing them delivers the biggest wins.

We’ll start by resizing each image to 2x its rendered display size so that it looks sharp even on retina screens without wasting bandwidth.

Here’s how I quickly find the rendered size:

Open your page in Chrome, inspect the image, and hover over the source URL to find the “rendered size.”

Then run them through compression using plugins like TinyPNG, ShortPixel, or your image editor’s export settings work great. You’ll typically see 50-70% reductions in file size before any noticeable quality loss.

For background images, just compress them without resizing since they need to cover larger areas. This step takes time, but it’s where you’ll see the most impact. A 2MB page can easily become 400KB just by handling images properly.

2. Serve Images in Modern Formats

Compression helps, but modern formats like WebP and AVIF can shrink file sizes by another 30-50% compared to JPEGs and PNGs. These next-gen formats use smarter compression that older formats simply can’t match.

Most WordPress sites still serve traditional formats by default. However, you can convert images using plugins like ShortPixel or export them directly from your image editor. Just make sure your server is configured to serve these formats with proper fallback for older browsers.

The payoff is immediate. A 157KB JPEG often becomes a 20KB WebP or 11KB AVIF. For image-heavy landing pages, those savings compound fast.

3. Lazy-Load Offscreen Images and Media

Images are one of the biggest contributors to page size, but you don’t need to load them all at once. The loading attribute tells browsers which images matter right now and which can wait.

You can set loading=”eager” for images above the fold. This ensures your most important content appears immediately. You can use loading=”lazy” for everything below the fold so browsers only fetch them when users scroll near them.

If you’re using Oxygen, you can select your image and add the loading attribute directly in the Settings panel.

Once you’ve done this for one image, you can right-click to copy the settings and paste it across multiple images to save time. This simple change improves your Largest Contentful Paint and reduces initial load time significantly.

4. Set Explicit Width and Height on Images

When images load without reserved space, your page jumps around as content appears. This cumulative layout shift feels especially jarring on slow connections and frustrates visitors.

You can easily fix this by adding width and height attributes to every image. Remember the rendered dimensions you identified earlier? You can set those values here.

This tells browsers exactly how much space to reserve, keeping your layout stable while images load.

5. Serve Scaled Images

Serving the same large image to every device wastes bandwidth. A 2000px-wide hero image might look great on a desktop, but it loads painfully slowly on mobile phones.

WordPress creates multiple image sizes automatically when you upload and uses the srcset attribute to tell browsers to pick the perfect size for each screen. This means mobile users see the 400px version while desktop users see the full 1200px version.

Most themes and builders handle this automatically if you insert images through the editor. If you’re looking for manual control, you can use Enable Responsive Image to set sizes in the Block Editor. This one change cuts mobile load times dramatically while keeping images crisp on larger screens.

6. Use Fetch Priority for LCP Image

Your Largest Contentful Paint image is the most important visual element on the page. Browsers don’t always load it first, though, especially when multiple elements compete for bandwidth.

WordPress 6.3+ actually adds fetchpriority=”high” to your LCP image automatically, but I’ve found it doesn’t always guess correctly.. You can override this by setting the fetchpriority attribute manually, and help browsers make smarter loading decisions.

In Oxygen, select your LCP image (usually the hero or the featured image) and add the fetchpriority attribute directly in the Settings panel.

When combined with proper width and height attributes, this often shaves several hundred milliseconds off your LCP score. Google saw this improvement firsthand on Google Flights, dropping LCP from 2.6 seconds to 1.9 seconds.

7. Host Large Videos Externally

Uploading videos directly to WordPress is one of the biggest performance mistakes you can make. A single 1080p video can easily be 50-100MB, and your server isn’t optimized for streaming.

Instead, upload videos to YouTube or Vimeo. These platforms are built for efficient video delivery with adaptive streaming, global CDNs, and optimized compression. Embedding a video adds barely any weight to your page.

If you need private videos, use a dedicated video hosting service like Bunny Stream or Vimeo Pro. Your server stays focused on serving your website, and your visitors get smooth playback regardless of their connection speed.

8. Defer or Replace Heavy Initial-Load Videos

Videos kill performance when they auto-load. A single background video can add 5MB to your initial page weight and block rendering while it downloads.

The simplest fix is replacing auto-play videos with a placeholder image or “click to play” thumbnail. This way, the video only loads when someone actually wants to watch it. For background videos, ask yourself if the visual impact justifies the performance hit. Often, a well-optimized image works just as well.

If you must keep the video, add preload=”none” to prevent early downloading. This keeps your first paint fast and respects your visitors’ data.

For YouTube and Vimeo embeds, the Lazy Load for Videos plugin handles this automatically. Install it, activate it, and it replaces all your video embeds with click-to-play thumbnails.

WPDebug Toolkit uses this exact approach on its homepage. Here’s what that looks like.

9. Load Google Fonts Locally

Every time your site loads fonts from Google’s servers, it adds extra DNS lookups. This can result in 100-300ms of extra load time, even with browser caching.

You can eliminate this delay by hosting Google Fonts on your own server. Google provides fonts in TTF format, but you’ll want to convert them to WOFF2 for the best compression and performance.

Use FontSquirrel’s Webfont Generator to convert your TTF files to WOFF2. If that doesn’t work for your specific font, the Google Webfonts Helper can download all the WOFF2 files you need directly.

Once you have the WOFF2 files, upload them to Oxygen through Preferences → Custom Fonts.

After you add them, you can go to Variables and select them under Typography. Your pages now load fonts from your own domain, cutting out the external requests entirely.

10. Minimize the Impact of Web Fonts

Even locally hosted fonts add weight. Each font family with multiple weights can add 100-200KB to your page, so every optimization helps.

You can prevent text rendering delays by adding font-display: swap to your CSS. This shows text immediately using a fallback font, then swaps in your custom font once it loads. You can easily add this directly to your theme’s stylesheet.

For even better results, you can preload your most critical font files in your site header. This tells browsers to fetch them right away instead of waiting for CSS to parse. Here’s the snippet that you can add to your website’s header:

<link rel="preload" href="/wp-content/uploads/fonts/your-critical-font.woff2" as="font" type="font/woff2" crossorigin>

Just be selective and only preload fonts used in above-the-fold content. This combination of swap and preload often cuts font loading time in half.

11. Unload Unnecessary Scripts and Styles

WordPress loads a lot of assets that your pages don’t actually use. Contact form scripts on your homepage, WooCommerce styles on your blog, or comment JavaScript on pages without comments. Each adds extra weight and slows down rendering.

You can see what’s loading by opening Chrome DevTools and checking the Network tab. Look for CSS and JS files from plugins you don’t need on that specific page.
Once you spot these files, use a plugin like Asset CleanUp to disable them where they aren’t needed. The plugin shows you every asset on each page and lets you turn them off with a simple toggle. Start with your homepage since that’s where most visitors land.

12. Eliminate Built-In WordPress Bloat

WordPress includes features most sites never use, and they load on every page. The emoji script, embed functionality, and comment-reply JavaScript add up to extra requests and wasted bandwidth.

If you’re using Oxygen, you can disable most of this bloat right in the builder settings. Go to Oxygen → Settings → Performance and turn off the features you don’t need.

For other setups, you can use Perfmatters or another similar plugin. Removing these core scripts is safe and often cuts 2-3 HTTP requests from every page load.

13. Use Search Plugin to Improve Search Experience

Improving performance isn’t just about page speed. Even a fast-loading page feels broken if the search is slow. This hits WooCommerce stores especially hard, where shoppers rely on search to find products quickly.

AJAX search solves this by showing results instantly as users type. One plugin I recommend is Elevated AJAX Search for WooCommerce. It’s lightweight, highly customizable, and uses a pre-built search index to serve results without hitting your database.

Install it like any other WordPress plugin, add the shortcode, and it automatically replaces your standard search. 

14. Go Static for Simple WordPress websites

If your site doesn’t change often, you can convert it to static HTML. This removes PHP and database processing completely, making pages load almost instantly.
You can use the Simply Static plugin to generate a complete static copy of your site. Install it, run the export, and it creates HTML files you can upload to any hosting platform or serve from a CDN. Your WordPress installation stays separate, so you can still make edits and regenerate the static version when needed.

This approach eliminates security vulnerabilities, handles traffic spikes effortlessly, and typically improves load times by 80-90%.

15. Replace Plugins with Custom Code

Every plugin adds weight, even when deactivated. They load files, run checks, and sometimes make database queries on every page load. Many plugins add simple functionality that you could implement with a few lines of code.

While you can add code directly to your theme files, I use WPCodeBox to add custom code snippets directly in my WordPress admin. It includes a library of pre-built snippets for common features and a safe environment for testing your own code. It also comes with a functionality plugin feature where you can create a separate plugin from all your snippets that works even if you uninstall WPCodeBox.
This approach gives you a leaner site with fewer HTTP requests and less code to maintain. If you’re not sure where to start, this tutorial shows how to replace popular plugins with lightweight code: 10 popular plugins you can replace with code snippets.

16. Monitor Error Logs

Your error logs reveal problems that quietly slow down your site. PHP warnings and database errors waste server resources on every page load, even when everything seems to work fine.

You can enable error logging by adding two lines to your wp-config.php file. Connect to your site through FTP or your hosting file manager, open wp-config.php, and add:

define('WP_DEBUG', true);

define('WP_DEBUG_LOG', true);

This creates a debug.log file in your wp-content folder. Check this file weekly and look for repeated errors from the same plugin or theme file. These are your biggest performance drains.

If editing files isn’t your thing, you can use a plugin like WPDebug Toolkit that gives you the same control through a simple dashboard.

17. Tune or Disable the WordPress Heartbeat API

The Heartbeat API sends wp-admin/admin-ajax.php requests to your server every 15-60 seconds. It’s what powers auto-saves and session checks, but on busy sites, it creates unnecessary load and spikes CPU usage.

These background requests waste server resources that should serve real visitors. On high-traffic sites, Heartbeat can generate hundreds of extra requests per minute.

You probably don’t need Heartbeat running on the front end of your site. You can disable it completely for logged-out users while keeping it active (but less frequent) in the admin area.

Add this code to disable Heartbeat on the front end:

add_action('init', function() {
    if (!is_admin()) {
        wp_deregister_script('heartbeat');
    }
}, 1);

Then add this to increase the interval in your backend:

add_filter('heartbeat_settings', function($settings) {
    $settings['interval'] = 60; 
    return $settings;
});

You can add both snippets using a plugin like WPCodeBox or directly in your theme’s functions.php file. This combination cuts background requests dramatically while keeping auto-saves working in your admin area.

18. Switch to Lighter Spam Protection

CAPTCHA is essential for blocking spam, but your choice of solution can seriously impact performance. Google reCAPTCHA is the most common option, but it loads over 400KB of JavaScript and pulls additional fonts from Google’s servers. That’s a massive payload, especially on mobile connections.

A better approach is the honeypot method. It’s a lightweight alternative that doesn’t make any external calls. If you need a more robust solution, Cloudflare Turnstile is also an excellent alternative. It’s free, privacy-focused, and adds less than 10KB to your page.

19. Enable Full Page Caching and Compression

I saved caching and compression for last on purpose. These tools magnify the impact of your optimizations, but they can’t fix underlying problems. A well-optimized site with caching loads fast. A bloated site with caching still loads slowly.

Most hosts make this easy. Check your hosting dashboard for caching options and turn them on. For example, I’m using Cloudways, and it has Breeze integrated.

The performance jump is immediate. A page that loads in 1.5 seconds might now load in 600 milliseconds. But remember, this works because you already fixed the fundamentals. Caching makes a good site great, but it can’t make a slow site fast.

20. Use a CDN

A CDN stores copies of your images, CSS, and JavaScript on servers around the world. When someone visits your site, they download files from the nearest location instead of your main server. This reduces load time, especially for visitors far from your hosting location.

Setting up a CDN is straightforward. Services like Cloudflare or BunnyCDN walk you through the process. Once configured, they automatically cache your static files and serve them from their global network. Most WordPress caching plugins include CDN integration, so you can enable it with a few clicks.

Here’s how my settings look in Breeze:

Performance After Optimization

After implementing these 20 tips, here’s what actually changed. The GIF below shows the same landing page loading on a simulated slow 4G connection, after the optimization. You’ll see content appear almost immediately, images load smoothly without layout shifts, and the page feels completely usable within two seconds.

The waterfall chart tells the same story. Before optimization, you see a long chain of render-blocking resources loading one by one. Afterward, the critical path is clean, images load in parallel, and the browser paints meaningful content much sooner.

Here’s a table with before and after comparisons of various Core Web Vitals to give you a better idea:

Common Questions: WordPress Speed Optimization

1. How do I increase my WordPress website speed?

Start with images. Resize to 2x display size, compress them, and use WebP format. Set explicit width and height attributes to prevent layout shifts. Lazy-load below-fold images. Remove unused scripts with Asset CleanUp. Then enable caching and compression. These fundamentals deliver real speed, not just better scores.

2. Why is my WordPress site running so slow?

Large, unoptimized images are the most common culprit. Other causes include plugins loading unnecessary scripts on every page, missing caching, heavy page builders, and third-party scripts. Check your error logs. PHP warnings waste server resources on every request.

3. How do I clear the cache on WordPress?

Go to your caching plugin settings (WP Rocket, W3 Total Cache, or your host’s built-in cache) and click “Clear Cache.” If your changes still don’t appear, clear your browser cache. Some hosts, like Cloudways, also have a cache purge button in your hosting dashboard.

4. Does page speed affect SEO?

Google uses Core Web Vitals as a ranking factor. But chasing perfect scores matters less than actual user experience. A site that loads quickly on slow connections ranks better because visitors stay longer and engage more. Focus on perceived performance first, tools second.

5. How to make a WordPress website more responsive?

Use responsive images with srcset so browsers serve smaller files to mobile devices. Disable heavy elements on mobile using Oxygen’s display settings or CSS media queries. Set proper width and height attributes on all images. Test on real mobile devices using Chrome DevTools, not just resizing your desktop browser.

Further Reading

• Elementor vs Divi: Speed and Performance