15 Tricks to Optimize WordPress Website Speed

Danny · August 12, 2026 · 8 min read · Updated August 13, 2026

From the five core PageSpeed metrics (FCP, LCP, TBT, CLS, SI) to 15 practical speed tricks for WordPress: server choice, plugin discipline, image compression and WebP, object cache, CDN, lazy loading, and page cache.

A Google study with SOASTA (2017) found a strong link between page load time and bounce rate: going from 1 second to 3 seconds raises the bounce rate by 32%; from 1 to 5 seconds, 90%; from 1 to 6 seconds, 106%; and from 1 to 10 seconds, 123%. So speeding up page loads is one of the first optimizations to do before a site goes live.

Google Pagespeed Insights

Google PageSpeed Insights is Google’s free website performance testing tool. It scores overall Performance based on load speed, interactivity, and visual stability, and lists specific optimization suggestions.

Google PageSpeed Insights report

Several key metrics make up the Performance score: FCP (First Contentful Paint), LCP (Largest Contentful Paint), CLS (Cumulative Layout Shift), TBT (Total Blocking Time), and Speed Index.

To use it: visit pagespeed.web.dev, enter a URL, and click Analyze.

What is FCP/LCP/TBT/CLS/SI?

These five metrics determine the Performance score (0-100) and are the core reference for measuring user loading experience. Here is what each one means.

Lighthouse performance scoring calculator

First Contentful Paint (FCP)

FCP is the time until the browser first renders any content (text, images, SVG, etc.) after the user clicks the page. It shows whether anything appears on screen quickly.

DeviceGreen (fast)Yellow (moderate)Red (slow)
Mobile0-1.8 s1.8-3 sOver 3 s
Desktop0-0.9 s0.9-1.6 sOver 1.6 s

How to improve: compress and prioritize critical CSS, use smaller images and WebP, defer third-party JS. FCP accounts for 10% of the Performance score.

Largest Contentful Paint (LCP)

LCP is the time until the largest visible content element appears on screen, such as a hero image (the big image in the banner area) or a large headline.

DeviceGreen (fast)Yellow (moderate)Red (slow)
Mobile0-2.5 s2.5-4 sOver 4 s
Desktop0-1.2 s1.2-2.4 sOver 2.4 s

How to improve: preload large images or headline fonts, disable lazy loading on above-the-fold images, reduce render-blocking resources, size images for mobile. LCP accounts for 25% of the score.

Total Blocking Time (TBT)

TBT is the total time between FCP and the page becoming interactive during which tasks block the main thread. It measures whether JavaScript is slowing down the page’s response to user input.

DeviceGreen (fast)Yellow (moderate)Red (slow)
Mobile0-200 ms200-600 msOver 600 ms
Desktop0-150 ms150-350 msOver 350 ms

How to improve: defer JavaScript execution, split large files and remove unused JS, reduce third-party tracking scripts. TBT accounts for 30% of the score, the highest weight.

Cumulative Layout Shift (CLS)

CLS measures how much content jumps or moves during page load. It tracks visual stability, so buttons and paragraphs do not suddenly shift.

ScoreRating
0-0.1Green (good)
0.1-0.25Yellow (needs improvement)
Over 0.25Red (poor)

How to improve: set explicit width and height on images and videos, avoid size flashes during lazy loading, avoid inserting ads or iframes. CLS accounts for 25% of the score.

Speed Index (SI)

SI measures how quickly visible content appears during page load, from the user’s visual perspective, rather than a single point in time.

DeviceGreen (fast)Yellow (moderate)Red (slow)
Mobile0-3.4 s3.4-5.8 sOver 5.8 s
Desktop0-1.3 s1.3-2.3 sOver 2.3 s

How to improve: load above-the-fold content first, defer non-critical resources, compress and optimize image sizes. SI accounts for 10% of the score.

How to Boost Your WordPress Website’s Performance Score

(1) Choose an excellent server environment

The ceiling on your site’s load speed starts with the server infrastructure. A good server should have high-performance storage (NVMe SSD), object caching support (Redis or Memcached), HTTP/3 + QUIC, and good integration with caching plugins.

We recommend Hostinger with LiteSpeed Web Server. LiteSpeed paired with the official LiteSpeed Cache plugin gives you deep caching: page-level caching, automatic image lazy loading, deferred JS, critical CSS, and QUIC.cloud CDN integration. Hostinger’s mid and high tiers ship with LiteSpeed Server by default, plus Redis, HTTP/3, and Opcache built in, with no extra configuration.

If you are on Nginx or Apache, plugins like FlyingPress or WP Rocket work, but LiteSpeed with LiteSpeed Cache has the deeper integration.

(2) Slim down your plugins

The WordPress plugin directory makes it easy to install one more plugin every time you want a feature. After dozens of plugins, performance gets hard to improve no matter what you do. Three reasons: many plugins inject their own CSS, JS, and font files into every page, causing render blocking and lower FCP, LCP, and Speed Index; backend plugin logic (database queries, REST API requests) adds PHP execution and memory load; plugins can duplicate or conflict on resources, two plugins loading the same icon library or form library hurt SI, and CSS/JS conflicts cause CLS.

Cutting plugins is the easiest and highest-value optimization there is.

(3) Compress image pixels and file sizes

Control upload pixel dimensions and file sizes while keeping clarity. Use image editing software, compression tools, or WordPress plugins.

Pixel suggestions: banner images at 1600×800 or 1600×900; element images at 800-1000 per side; product images at 800-1000 per side; logos around 300 per side; favicons at 50-100 per side; SVG icons around 300 per side. File size: 200KB or less, the smaller the better while keeping clarity.

Compress locally before uploading. Batch-compressing in a WordPress plugin can cause duplicate filenames and less control over the results.

(4) Convert image formats

Convert jpg, jpeg, and png to WebP. WebP keeps high quality while being 25-70% smaller, which means faster loading. Use a tool that both compresses and converts, locally, then upload the result.

(5) Control image dimensions on your pages

When inserting images, set non-banner images to large or medium in the editor so they display at the size you choose regardless of the original resolution. The example below uses Elementor Pro to set an image to display at large, 1024×1024.

Elementor image size setting

(6) Stick to static images for your homepage banner

The hero area decides LCP and Speed Index. Carousels usually load 2-5 images, adding significant weight to the first screen; video backgrounds pull in heavy JS logic and video files that block initial rendering.

Use a single, well-compressed static WebP image as the banner, add it to Lazy Load Image Excludes so it does not lazy load, and avoid slider plugins and background video components above the fold.

(7) Localize fonts and icons

Download font files, upload them to your server, and disable Google Fonts. With Elementor Pro, upload the files to Custom Fonts. Download SVG icons at controlled sizes and upload them to the media library instead of using the editor’s icon library. Both reduce external resource requests.

Elementor Pro custom fonts

(8) Object cache

Object caching stores WordPress database query results in memory so repeat visits read from memory instead of re-running database operations. WordPress queries the database for post content, settings, and user info on every page load; with object caching, these results live in Redis or Memcached and read much faster.

How to set it up: make sure your cloud server supports Redis or Memcached (Redis first), log into Hostinger and confirm Object cache is enabled in Overview; then install LiteSpeed Cache, go to Cache → Object → Enable redis, and confirm with Query Monitor. On a self-managed panel, install the Redis extension manually.

Hostinger object cache enabled

(9) Opcache

WordPress runs on PHP, and Opcache is PHP’s opcode cache: it stops PHP files from being re-parsed on every request. Most hosts enable it by default on one-click WordPress installs; on a self-managed panel, install and enable the Opcache extension manually.

Opcache installed status

(10) CDN

A CDN copies static assets (images, CSS, JS) to nodes around the world, so users load them from the nearest node. The gain is most visible for overseas visitors.

How to set it up: many hosts (like Hostinger) offer a free CDN you can enable from the Performance section of the dashboard; Cloudflare’s free plan works by changing your nameservers; premium options like BunnyCDN, KeyCDN, and Quic.Cloud (LiteSpeed-specific) are also worth considering. For WooCommerce or frequently-updated sites, configure cache exclusion rules so dynamic pages are not cached.

(11) Image lazy loading

Lazy loading loads only the images in the viewport on the first visit and defers the rest until the user scrolls to them. It cuts first-screen resources and improves FCP, LCP, and Speed Index. WordPress 5.5+ enables it by default. Enable it only for non-above-the-fold images; the banner and hero image should not lazy load.

(12) Page cache

Page caching stores the fully rendered HTML in server memory, so repeat visits skip PHP execution and database queries and return cached content. Use WP Rocket, LiteSpeed Cache, or FlyingPress, and combine with object caching for the best result. Exclude pages like cart and user account pages to avoid serving stale cached versions.

(13) CSS minify

Optimizing CSS reduces render blocking and speeds up page painting. Merge multiple CSS files to cut requests (avoid over-merging), use delay CSS features (like WP Rocket’s), and remove unused CSS with tools such as PurgeCSS.

(14) JS minify

JavaScript optimization is key for TBT and INP. Enable Delay JS Execution, defer JS so it does not block HTML rendering, exclude critical scripts (like elementorFrontendConfig) to keep interactions working, and reduce third-party scripts like heatmaps, ads, and chat widgets.

(15) Preload cache

Preload generates page cache before users visit, so the first visit needs no wait. Enable Preload in WP Rocket or LiteSpeed Cache, preload fonts, hero images, and above-the-fold JS with preload or preconnect tags, and point the tool at your sitemap.xml so core pages get pre-cached on a schedule.

Performance optimization is a systematic job. For WordPress + Elementor sites, combining good optimization plugins (WP Rocket, LiteSpeed Cache, Perfmatters), disciplined image management, and a caching strategy is how you get load times under 1-2 seconds and improve both user experience and SEO.

More guides like this,
every Thursday.

Hosting reviews, builder comparisons, performance tips, and plugin picks — curated weekly for WordPress site owners and builders.