Fix WordPress LCP Free: LiteSpeed + Cloudflare

Fix WordPress LCP free using LiteSpeed Cache and Cloudflare — this is easier than most people think, and it costs absolutely nothing. If your WordPress site is scoring below 80 on Google PageSpeed Insights, your LCP (Largest Contentful Paint) is almost certainly the main culprit. I’ve covered the broader SEO picture in my best AI SEO tools for bloggers guide — but speed is the foundation everything else builds on.

StarmarkAI.com was sitting at a painful 69/100 mobile score, with LCP hitting 4.4 seconds — nearly double Google’s recommended threshold of 2.5 seconds. It was silently hurting rankings every single day. The fix used only free tools: LiteSpeed Cache and Cloudflare Free — zero paid plugins, zero coding. By the end, StarmarkAI went from 69 → 91 performance score, TBT dropped from 510ms to just 10ms, and SEO hit a perfect 100.

⚡ AEO QUICK ANSWER Can you fix WordPress LCP free using LiteSpeed Cache and Cloudflare? Yes — enable Viewport Images (VPI) and JS Defer in LiteSpeed Cache, then connect Cloudflare Free as your CDN with Auto Minify and Rocket Loader turned OFF. Exclude your hero image from lazy load and enable Critical CSS. This exact LiteSpeed and Cloudflare combination took StarmarkAI’s mobile score from 69 to 91 in under one hour — at zero cost. Beginner tip: Always purge all caches after every setting change — otherwise you won’t see the real improvement in PageSpeed Insights.

What is WordPress LCP and Why It Hurts Your Rankings

LCP (Largest Contentful Paint) measures how long it takes for the biggest visible element on your page — usually a hero image or featured post thumbnail — to fully load on screen. When you fix WordPress LCP, you are directly improving one of Google’s three Core Web Vitals. According to Google’s Core Web Vitals documentation, a poor LCP score means Google directly penalises your rankings in search results.

Here is the scoring breakdown you need to understand before fixing anything. Under 2.5 seconds is Good — rankings are boosted. Between 2.5s and 4.0s is Needs Improvement — neutral impact on rankings. Over 4.0 seconds is Poor — rankings are actively hurt. StarmarkAI was at 4.4s — firmly in the red zone and losing Google rankings daily. Fixing WordPress LCP was not optional. It was urgent.

Free Tools Used to Fix WordPress LCP with LiteSpeed and Cloudflare

Every tool in this stack is completely free. Here is what I used and why each one matters when you want to fix WordPress LCP without spending anything. The combination of LiteSpeed Cache and Cloudflare Free is the most powerful free WordPress performance stack available in 2026 — and I tested all of them before settling on this exact setup.

The reason this stack works so well is the division of labour. LiteSpeed Cache handles all the heavy optimisation — image preloading, JavaScript deferral, CSS delivery. Cloudflare then takes the already-optimised cached files and delivers them from edge servers physically close to your visitors. Neither tool steps on the other’s work — as long as you configure them correctly, which is exactly what this guide covers.

How I Tested — Real Case Study on StarmarkAI

I tested StarmarkAI.com using Google PageSpeed Insights (mobile) on March 8, 2026. I ran three separate tests — before any changes, after Cloudflare settings only, and after the full LiteSpeed Cache optimisation was applied. All tests were done in incognito mode with no browser extensions running, using the default Moto G Power emulation that PageSpeed Insights uses by default.

I documented every setting change and noted which step had the biggest impact on LCP. The answer was clear after the first round of results: enabling VPI and excluding the hero image from lazy load — both inside LiteSpeed Cache — moved the needle more than anything else. Cloudflare alone took the score from 69 to 89. LiteSpeed Cache on top of that pushed it to 91 and dropped TBT from 510ms to 10ms.

Before vs After: Fix WordPress LCP Free Results

These are real numbers from StarmarkAI.com — not estimates, not projections. Every metric below was recorded from Google PageSpeed Insights mobile test on the same homepage URL across three separate testing rounds.

How to Fix WordPress LCP Free: Cloudflare Setup Step by Step

Cloudflare’s job in this stack is simple: act as a CDN and deliver your cached files from edge servers close to your visitors. The critical rule is to let LiteSpeed Cache handle all the optimisation work — Cloudflare should not duplicate it. Every conflict I’ve seen between these two tools comes from Cloudflare trying to minify or transform files that LiteSpeed has already processed.

Step 1 — SSL/TLS: Set Full Strict Mode

Go to SSL/TLS → Overview and set SSL Mode to Full (Strict). Never use Flexible mode — it causes mixed content errors with LiteSpeed Cache on your WordPress site and will actively break your LCP fix.

Step 2 — Speed → Content Optimization: Turn OFF Everything

Set Auto Minify JavaScript → OFF, Auto Minify CSS → OFF, Auto Minify HTML → OFF, and Rocket Loader → OFF. LiteSpeed Cache handles all minification. Running both simultaneously creates conflicts that increase LCP, not reduce it. This is the most common mistake I see in tutorials that tell you to use both tools without specifying which settings to disable.

Step 3 — Speed → Recommendations

Enable Speed Brain → ON, Cloudflare Fonts → ON, and Early Hints → ON. Keep Rocket Loader → OFF. Early Hints (HTTP 103) tells browsers to start loading resources before the full HTML response arrives — this directly reduces WordPress LCP by giving the browser a head start on your critical assets.

Step 4 — Caching → Configuration

Set Caching Level → Standard, Browser Cache TTL → Respect Existing Headers, and Always Online → OFF. Setting Browser Cache TTL to Respect Existing Headers lets LiteSpeed Cache control cache duration — avoiding conflicts and ensuring your WordPress LCP fix stays effective long-term.

Step 5 — Purge Everything

After saving all settings, go to Caching → Purge Everything. This forces Cloudflare to fetch fresh optimised files from your LiteSpeed server. Never skip this step — testing PageSpeed Insights before purging will show you stale results and make it look like nothing changed.

Fix WordPress LCP Free: LiteSpeed Cache Complete Setup

LiteSpeed Cache is doing the heavy lifting in this stack. Follow these steps in exact order — the sequence matters because some settings depend on others being active first. I made the mistake of enabling Critical CSS before connecting QUIC.cloud on my first attempt and got no results for three days.

Step 1 — General Settings

Enable Automatically Upgrade → ON, Guest Mode → ON, and Guest Optimization → ON. Guest Mode creates an always-cacheable version of your pages for new visitors — essential for maximum LCP performance improvement on mobile.

Step 2 — Cache Settings

Set Enable Cache → ON, Cache Logged-in Users → OFF, Cache Commenters → OFF, Cache REST API → ON, Cache Login Page → ON, and Cache Mobile → ON. Cache Mobile is critical — your WordPress LCP on mobile will never improve if mobile visitors are not being served cached pages. This setting alone made a visible difference on StarmarkAI within one hour of enabling it.

Step 3 — TTL Settings

Set all TTL values to 604800 (one week): Default Public Cache TTL, Default Front Page TTL, Default Feed TTL, and Default REST API TTL. Longer cache lifetimes mean fewer server requests and faster delivery for repeat visitors.

Step 4 — Page Optimization: CSS

Enable CSS Minify → ON, CSS Combine → ON, Load CSS Asynchronously → ON, and Generate Critical CSS → ON. Critical CSS inserts the styles needed for above-the-fold content directly into your HTML — eliminating render-blocking CSS that delays FCP and contributes to WordPress LCP issues. QUIC.cloud generates this automatically once your account is connected.

Step 5 — Page Optimization: JS — The TBT Fix

Enable JS Minify → ON, set JS Combine → OFF, and enable Load JS Deferred → ON. JS Defer was the single biggest fix on StarmarkAI — it dropped Total Blocking Time from 510ms to just 10ms, a 98% reduction. If you only make one change from this entire guide, make it this one. The reason it works so dramatically is that deferred JavaScript no longer blocks the browser from rendering your page content first.

Step 6 — Media Settings: The Core LCP Fix

Enable Lazy Load Images → ON and Viewport Images (VPI) → ON. Then — and this is the step most tutorials skip — go to Lazy Load Excludes and add .wp-post-image and .post-thumbnail img. This prevents your hero image from being lazy loaded. Lazy loading the LCP image is the single most common cause of poor WordPress LCP scores — even when using LiteSpeed Cache and Cloudflare together. VPI preloads the image. The exclusion ensures that preload is never cancelled by lazy load. Both settings must be active simultaneously to get the full benefit.

Step 7 — Image Optimization: WebP Conversion

Enable Auto Request Cron → ON, Auto Pull Cron → ON, Create WebP → ON, and Lossless Optimize → ON. Click Send Optimization Request. QUIC.cloud converts all your WordPress images to WebP format — smaller files load faster and directly improve LCP. According to Google’s WebP documentation, WebP images are 25–35% smaller than equivalent JPEGs with no visible quality loss.

Asset CleanUp — Conflict-Free Settings with LiteSpeed

Asset CleanUp’s role is narrow but powerful: unload CSS and JS files that are not needed on specific pages. Used correctly, it removes hundreds of kilobytes of unnecessary code from your WordPress homepage — code that was slowing LCP without serving any function on that particular page.

First, turn off everything that LiteSpeed Cache already handles. Set Minify CSS/JS → OFF, Combine CSS/JS → OFF, and Page Caching → OFF inside Asset CleanUp. Running these alongside LiteSpeed creates conflicts that can increase LCP instead of fixing it. Then use the Unload feature to remove Contact Form 7 CSS and JS (if no form on homepage), WooCommerce scripts (if no shop on homepage), Comment reply JS (if comments disabled), and any slider or gallery CSS not used on the homepage. Always enable Test Mode first — test while logged in, then verify in incognito before going live.

Engineer’s Secret — The #1 LCP Trick Most Tutorials Miss

🔧 ENGINEER’S SECRET Enable VPI AND exclude your hero image from lazy load — at the same time. Most tutorials only tell you one or the other. Doing both together dropped StarmarkAI’s LCP by nearly 1 full second immediately after a cache purge. No paid tools. No code. Just two settings in LiteSpeed Cache working together. VPI tells the browser to preload your LCP image at the earliest possible moment. The Lazy Load Exclude setting ensures the browser does not then immediately delay that same image. Together they send one clear signal: load this image immediately, at highest priority, with no delays. Cloudflare Early Hints then pre-signals this preload even before the full HTML response arrives from the server.

Real Output — Actual PageSpeed Results After the Fix

The most dramatic improvement was TBT — from 510ms to 10ms. That is a 98% reduction purely from enabling JS Defer in LiteSpeed Cache. No paid plugins. No code changes. Just one toggle inside Page Optimization → JS. The three-round test below shows exactly where each improvement came from and which tool was responsible.

The LCP is still at 3.4s — not yet under Google’s 2.5s green threshold. The next step to push it below 2.5s is hero image compression to under 80KB in WebP format. That is a separate optimisation step not covered by LiteSpeed Cache alone. But going from 69 to 91 performance score and eliminating 500ms of blocking time is a real, measurable ranking improvement that costs nothing.

Pros and Cons: Fix WordPress LCP Free with LiteSpeed + Cloudflare

After running this stack on StarmarkAI for several weeks, here is an honest assessment of what works well and where the limitations are. Nothing in this list is theoretical — every pro and every con is something I experienced personally during setup and ongoing use.

Who Should Use This Fix WordPress LCP Free Guide

✅ This is for you if:

Your WordPress site runs on LiteSpeed hosting — LiteSpeed Web Server or OpenLiteSpeed — and your mobile PageSpeed score is below 80.

You are a blogger or affiliate marketer who wants better Google rankings without spending money on premium speed plugins like WP Rocket or NitroPack.

❌ Skip this if:

Your site runs on Apache or Nginx servers — LiteSpeed Cache plugin works best on LiteSpeed server infrastructure and some features like VPI will not function correctly otherwise.

You run a WooCommerce store with complex checkout flows or heavy membership content — caching logged-in users and checkout pages requires extra exclusion rules not covered in this guide.

Personal Verdict

⭐ PERSONAL VERDICT After testing this exact stack on StarmarkAI.com, the verdict is clear: LiteSpeed Cache plus Cloudflare Free is the most powerful way to fix WordPress LCP free in 2026. The TBT result alone — 510ms dropping to 10ms — is something paid plugins like WP Rocket often struggle to match. Hitting SEO score 100 is the kind of result that directly translates to better search visibility and more organic traffic. The LCP is not yet under 2.5s, and I want to be honest about that. But going from 69 to 91 in under an hour with zero budget is a result I’d take every time. According to web.dev’s Core Web Vitals guide, even a 0.1s improvement in LCP can meaningfully impact user experience and bounce rate — StarmarkAI achieved a 1.0s improvement. Performance Score: ⭐ 9/10

FAQ — Fix WordPress LCP Free

How do I fix WordPress LCP free using LiteSpeed and Cloudflare?

Enable Viewport Images (VPI) and JS Defer in LiteSpeed Cache, connect Cloudflare Free as your CDN, turn off Auto Minify and Rocket Loader in Cloudflare, and exclude your hero image from lazy loading using .wp-post-image in the Lazy Load Excludes field. This exact combination took StarmarkAI from score 69 to 91 in under one hour at zero cost.

Does Cloudflare Free actually help fix WordPress LCP?

Yes, but indirectly. Cloudflare Free delivers your LiteSpeed-cached files from edge servers close to your visitors, reducing TTFB. But Cloudflare alone will not fix WordPress LCP — LiteSpeed Cache must handle the actual image preloading and JS deferral. The two tools work together, not independently.

Should I use Cloudflare APO to fix WordPress LCP?

No — not if you already have LiteSpeed Cache. APO costs $5 per month and caches HTML at Cloudflare’s edge. LiteSpeed Cache already does this at the server level for free. APO is only useful on Apache or Nginx servers without LiteSpeed. Save the money.

Why is my WordPress LCP still high after enabling LiteSpeed Cache?

The most common reason is your hero image is still being lazy loaded. Go to Page Optimization → Media → Lazy Load Excludes and add .wp-post-image and .post-thumbnail img. Also confirm VPI is enabled and your QUIC.cloud account is connected and active. Without QUIC.cloud, VPI and Critical CSS will not function correctly.

What is VPI in LiteSpeed Cache and how does it fix LCP?

VPI stands for Viewport Images. It automatically detects images visible in the first screen of your WordPress page and preloads them with fetchpriority=”high”. This tells the browser to load your LCP image immediately — directly reducing your WordPress LCP time in PageSpeed Insights. Pair it with Lazy Load Excludes for maximum impact.

Final Thoughts

You do not need expensive plugins or a developer to fix WordPress LCP free. With LiteSpeed Cache and Cloudflare Free, you have everything required to dramatically improve your Core Web Vitals — at zero cost. The five steps that made the biggest difference on StarmarkAI: VPI → ON in LiteSpeed Cache, hero image excluded from lazy load, JS Defer → ON in LiteSpeed, Auto Minify and Rocket Loader OFF in Cloudflare, and Browser Cache TTL set to Respect Existing Headers. If your LCP is still above 2.5s after following this guide, the next step is compressing your hero image to under 80KB in WebP format. That single change can push a 3.4s LCP below the green threshold. For more on building a fast, rankable WordPress site from scratch, the beginner’s guide to starting a blog covers the full setup stack.

Meet Shahin

AI Automation Engineer

Shahin is an AI Automation Engineer and founder of StarmarkAI. He tests every tool on a paid plan before writing about it and documents real results from his own sites so you know exactly what to expect.

About Contact LinkedIn →