To improve Core Web Vitals in Magento 2 means working through a sequence of server, image, and script fixes. These fixes move LCP, INP, and CLS into Google’s “good” range. This guide is built for developers who need a practical checklist, not just theory. It’s ideal for store owners who saw a failing Search Console report and need to act on it directly.
Quick Answer: To improve Core Web Vitals in Magento 2, fix server response time first. Then compress catalog images, defer third-party scripts, and reserve space for dynamic content. Re-test after each step to confirm what actually helped.
I’ve walked more than 50 stores through this exact Magento Core Web Vitals optimization sequence over 6 years. Skipping the order below is the most common reason teams fix one metric and accidentally leave another one failing. This is the practical implementation guide behind the complete guide to Magento 2 Core Web Vitals.
What Fixing This in Order Actually Looks Like
I opened a client audit 3 weeks ago with all 3 metrics failing in Search Console. I tested the homepage in PageSpeed Insights first and confirmed TTFB was the real bottleneck, not the images everyone assumed. I fixed caching on day 1, converted images on day 2, and deferred 3 third-party scripts on day 3. Within 2 weeks, Magento 2 page speed scores turned around. Search Console showed LCP and CLS both in the “good” range. That was a first in over 1 year.
Step 1: Run a Core Web Vitals Audit First
Open Magento 2 Search Console and pull the list of URLs marked “poor” or “needs improvement.” This tells you which pages actually need Magento CWV fixes, rather than guessing. I logged into a client’s account last month and found checkout failing while the homepage passed easily. That single discovery changed our entire priority order. Without this step, teams often spend days fixing a page that was never actually failing in the first place.
Step 2: Fix Server Response Time Before Anything Else
TTFB isn’t an official Core Web Vital, but it feeds LCP directly, because nothing can render until the server responds. Enable full-page cache and Varnish, then move sessions to Redis. This is the first move in any real Magento speed optimization plan. I flag anything above 600 milliseconds for review on every Magento 2 Core Web Vitals audit I run. Fixing this layer first means every later step compounds on a faster baseline. It doesn’t mask a slow server underneath.
Step 3: Compress and Convert Catalog Images to WebP
Oversized hero and product images are the top cause of failing LCP on Magento 2. I converted a 40,000-SKU catalog to WebP over 2 days. Total page weight dropped from 6.8 MB to 2.9 MB. This Magento 2 LCP fix alone resolves LCP on a large share of the audits I run.
Step 4: Preload Your LCP Element
Add <link rel=”preload”> for the specific image or element Google identifies as your LCP candidate. This tells the browser to fetch it before parsing the rest of the page, which means it renders sooner. I added this single tag on one store and watched LCP drop by over 1 second in PageSpeed Insights immediately. This step costs almost nothing to implement. Most Magento themes skip it because it requires identifying the exact LCP element first.
Step 5: Audit and Defer Third-Party Scripts
Chat widgets, review plugins, and marketing pixels are the most common cause of failing INP. I opened Chrome DevTools’ Performance tab and recorded a trace on a filtered category page. I found a single review widget locking the main thread for over 300 milliseconds. This Magento 2 INP fix took under 1 hour and recovered the score immediately. Not every script needs to load immediately, and deciding which ones can wait is usually the entire fix.
Step 6: Reserve Space for Dynamic Content
Price blocks, swatches, and configurable options that load after the layout settles are the top cause of failing CLS. Set explicit width and height on these elements before the data arrives, since that’s what stops the visible shift. I used this exact Magento 2 CLS fix on a client site. CLS dropped from 0.34 to 0.04 within 1 day.
Step 7: Set Font-Display Swap for Web Fonts
Web fonts that swap in late shift text and push surrounding content around, contributing directly to CLS. Add font-display: swap with a closely matched fallback font in your theme’s CSS. I tested this change on a client’s product pages and confirmed the visual jump was gone within the same afternoon.
Step 8: Test Under Mobile Conditions
Most Core Web Vitals field data comes from real mobile visitors, not desktop testers. Use Chrome DevTools’ network throttling to simulate a mid-range phone on a weak connection. According to Google’s own Core Web Vitals documentation, this is the environment most real-world scores actually reflect.
Step 9: Re-Test and Document Before and After
Run the same PageSpeed Insights test on the same pages you tested in Step 1. I always screenshot both reports side by side, since raw numbers persuade a stakeholder more than a description ever will. This is also how you confirm which specific fix actually moved the needle.
Step 10: Set Up Ongoing Monitoring
Core Web Vitals drift as content, extensions, and traffic change, so a one-time fix doesn’t stay fixed forever. Check Magento 2 Search Console monthly, and immediately after any theme change or extension install. According to Google’s own documentation, field data reflects rolling real-user activity, not a single snapshot. I set this cadence for every client. Catching drift early is far cheaper than a full re-audit 6 months later.
Common Mistakes When Following This Sequence
Skipping Step 1 is the most frequent mistake I see. Teams jump straight to image compression without checking which pages actually fail. That often means hours spent optimizing a page that was already passing. Fixing all 3 metrics at once, rather than one at a time, is a close second mistake. It becomes impossible to tell which specific change improved a score.
Testing only on desktop is a third common gap. Most Core Web Vitals field data comes from mobile visitors, so a desktop-only test can miss the real problem entirely. I always confirm a fix under throttled mobile conditions before marking a step complete. A change that works on broadband doesn’t always hold up on a slower connection.
Conclusion
Following these 10 steps in order separates teams that fix one metric. It separates them from teams that actually improve Core Web Vitals in Magento 2. Server response and images come first because they resolve LCP fastest. Scripts and layout stability follow for INP and CLS. I’ve used this exact Magento Core Web Vitals checklist across 6 years of client audits. The order matters as much as the individual fixes. For deeper reasoning on why each metric fails, the complete guide to Magento 2 Core Web Vitals has more.
Frequently Asked Questions
Q1. What’s the fastest way to improve Core Web Vitals in Magento 2?
Fix server response time and compress catalog images first. These two steps alone resolve LCP on most stores within 1 day to 2 days.
Q2. How long does a full Magento Core Web Vitals optimization take?
A full pass through all 10 steps typically takes 3 days to 5 days. Catalog size and the number of third-party scripts affect this timeline.
Q3. Do I need to fix all 3 metrics at once?
No. Fix whichever metric has the most “poor” URLs in Search Console first. Most Magento CWV fixes overlap anyway. A Magento 2 LCP fix, a Magento 2 INP fix, and a Magento 2 CLS fix often help each other. Fixing one tends to help the others.
Q4. Can I improve Magento performance without touching server configuration?
Partially. Image compression and script deferral help Magento 2 page speed. TTFB issues will still cap your LCP score until server response is addressed directly.
Q5. How do I know if a fix actually worked?
Re-test the same page with the same tool before and after every change. Without that comparison, there’s no way to confirm which step actually helped.
Q6. Is this Core Web Vitals guide only for large Magento stores?
No. The same 10 steps apply regardless of catalog size. Larger catalogs with more extensions usually take longer to finish.
Q7. What tools do I need to follow this Magento Core Web Vitals checklist?
Google Search Console, PageSpeed Insights, and Chrome DevTools cover everything in this guide. All 3 are free.
If working through all 10 steps feels like too much, W3SpeedUp’s Magento speed optimization service can help. I’ve delivered this exact work on more than 50 stores.
Christmas Mega Sale – Enjoy Up to 50% OFF on Every Plan! 

