PageSpeed Insights: Core Web Vitals for Better Site Performance

Farouk Ben. - Founder at OdownFarouk Ben.()
PageSpeed Insights: Core Web Vitals for Better Site Performance - Odown - uptime monitoring and status page

Google's PageSpeed Insights (PSI) has become the industry standard for measuring website performance. As someone who's spent countless late nights optimizing websites, I've learned that understanding this tool is crucial for any developer who wants to create fast, responsive websites that both users and search engines love.

In this guide, I'll walk you through what PageSpeed Insights is, why it matters, how to interpret your results, and—most importantly—how to use those insights to make meaningful improvements to your site.

Table of contents

  1. What is PageSpeed Insights?
  2. Why website speed matters in 2025
  3. Core Web Vitals: The metrics that actually matter
  4. How to run a PageSpeed Insights test
  5. Interpreting your PageSpeed Insights results
  6. Mobile vs. desktop scores: Understanding the difference
  7. Field data vs. lab data: What's the difference?
  8. Common performance issues and how to fix them
  9. PageSpeed score myths and misconceptions
  10. How Odown can help with performance monitoring

What is PageSpeed Insights?

PageSpeed Insights (PSI) is a free tool developed by Google that analyzes a webpage's performance on both mobile and desktop devices. It provides a comprehensive performance report that includes both real-user data (field data) and simulated data (lab data).

The tool evaluates various aspects of page performance including loading speed, responsiveness, and visual stability. Based on these factors, it generates scores and suggests specific optimizations to improve the user experience.

PSI has evolved significantly over the years. The latest version emphasizes Core Web Vitals metrics, which Google now uses as ranking signals in its search algorithm. This means that your PageSpeed scores don't just affect user experience—they can directly impact your visibility in search results.

I've personally seen sites jump multiple positions in search rankings after improving their Core Web Vitals scores. And trust me, those improvements translated directly to higher conversion rates and revenue.

Why website speed matters in 2025

Website speed isn't just a technical metric—it's a critical factor in user satisfaction and business success. Consider these stats:

  • A 1-second delay in page load time can result in a 7% reduction in conversions
  • 53% of mobile site visitors will leave a page that takes longer than 3 seconds to load
  • Slow-loading sites cost businesses an estimated $2.6 billion in lost sales annually

But the impact goes beyond just visitor retention. Search engines like Google have made page speed a ranking factor, meaning slower sites may be penalized with lower search visibility.

Think about your own browsing habits. How long do you wait for a site to load before giving up? Probably not very long. Most users expect pages to load in 2 seconds or less. Any longer than that, and you're likely to lose them to a competitor.

Speed affects everything from bounce rates to conversion rates, and from user satisfaction to SEO rankings. It's not just a technical consideration—it's a business imperative.

Core Web Vitals: The metrics that actually matter

When looking at your PageSpeed Insights report, you'll see a section dedicated to Core Web Vitals. These are the metrics Google considers most important for user experience, and they've become crucial for SEO.

The Core Web Vitals consist of three primary metrics:

1. Largest Contentful Paint (LCP)

LCP measures how long it takes for the largest content element on the page (like a hero image or text block) to become visible to the user. It's essentially a measure of loading performance.

Good LCP: 2.5 seconds or faster Needs improvement: 2.5 to 4 seconds Poor: Over 4 seconds

2. Cumulative Layout Shift (CLS)

CLS measures visual stability by quantifying how much elements on the page move around during loading. We've all had that frustrating experience of trying to click something only to have it jump away as a new element loads. That's what CLS measures.

Good CLS: 0.1 or less Needs improvement: 0.1 to 0.25 Poor: Over 0.25

3. Interaction to Next Paint (INP)

INP is a newer metric that replaced First Input Delay (FID). It measures how responsive your page is to user interactions like clicks, taps, and keyboard inputs.

Good INP: 200 milliseconds or less Needs improvement: 200 to 500 milliseconds Poor: Over 500 milliseconds

To pass the Core Web Vitals assessment, you need to score "Good" in all three metrics. And unlike the overall Performance score (which is based on lab data), Core Web Vitals are calculated using real user data, making them a more accurate reflection of how people actually experience your site.

I've found that focusing on these three metrics yields the biggest improvements in both user experience and search rankings.

How to run a PageSpeed Insights test

Running a PageSpeed Insights test is straightforward:

  1. Visit pagespeed.web.dev
  2. Enter the URL you want to analyze
  3. Click "Analyze"

That's it! The tool will analyze your page and generate a detailed report.

But before you start testing, here are a few tips:

  • Test both your homepage and key landing pages
  • Run tests at different times of day to account for traffic variations
  • Compare your results against competitors in your industry
  • Don't panic if you get different results on consecutive tests—some variation is normal

Sometimes the test might fail to load, showing an error message. This can happen for several reasons, including server failures, TLS/certificate issues, or if your site blocks the PageSpeed Insights crawler. If this happens repeatedly, you might need to check your server configuration or consult with a developer.

Interpreting your PageSpeed Insights results

Once you've run your test, you'll see a lot of information. Let's break down what you're looking at:

The overall performance score

At the top of the report, you'll see your overall performance score from 0-100. This is color-coded:

  • 90-100: Good (green)
  • 50-89: Needs improvement (orange)
  • 0-49: Poor (red)

This score is a weighted average of six metrics based on lab data:

  • First Contentful Paint (FCP)
  • Speed Index
  • Largest Contentful Paint (LCP)
  • Cumulative Layout Shift (CLS)
  • Total Blocking Time (TBT)

Each metric contributes differently to the overall score. For example, LCP and TBT have more weight than FCP.

Core Web Vitals assessment

Below the performance score, you'll find the Core Web Vitals assessment. This shows whether your site passes Google's Core Web Vitals thresholds based on field data from real users.

Unlike the overall performance score (which uses lab data), the Core Web Vitals assessment uses data from the Chrome User Experience Report (CrUX), which collects real-user measurements from millions of websites.

You'll see two views here:

  • "This URL" shows results for the specific page you tested
  • "Origin" provides results for your entire domain

To pass the assessment, you need to score "Good" on all Core Web Vitals metrics. A "Failed" status means at least one metric needs improvement.

Opportunities and diagnostics

The "Opportunities" section lists specific issues that are slowing your page down, along with an estimated time savings for each fix. These are arranged in order of potential impact, so focus on the top items first.

The "Diagnostics" section provides additional information about performance factors that don't directly impact the performance score but could still affect user experience.

Each item in these sections is expandable, revealing more details about the issue and often including the specific elements on your page that are causing the problem.

Mobile vs. desktop scores: Understanding the difference

You'll notice that PageSpeed Insights gives you separate scores for mobile and desktop. The mobile score is usually lower, and for good reason:

  1. Mobile devices typically have less processing power than desktops
  2. Mobile connections are often slower and less stable
  3. PSI simulates a throttled connection for mobile tests to better represent real-world conditions

Focus primarily on your mobile score. Most web traffic now comes from mobile devices, and Google uses mobile-first indexing for most websites. Plus, if you fix the issues affecting your mobile score, your desktop score will usually improve as well.

I once worked on a site that scored 85 on desktop but only 42 on mobile. After optimizing images, removing render-blocking resources, and implementing lazy loading, we raised the mobile score to 78. The desktop score also improved to 94 as a nice side effect.

Field data vs. lab data: What's the difference?

PageSpeed Insights provides two types of data:

Field data (real user measurements)

Field data comes from real users visiting your site. It's collected through the Chrome User Experience Report (CrUX) and reflects how real people experience your site "in the wild."

Pros:

  • Represents actual user experiences
  • Accounts for a variety of devices, browsers, and network conditions
  • Covers a 28-day period

Cons:

  • Only available for sites with sufficient traffic
  • Limited set of metrics
  • Can't be used for debugging (just measuring)

Lab data (simulated tests)

Lab data is collected by simulating a page load using a standardized environment via Lighthouse. This creates a controlled test environment.

Pros:

  • Available for all sites, regardless of traffic
  • Provides detailed diagnostics and debugging information
  • Consistent testing environment for comparing changes

Cons:

  • Doesn't represent the variety of real-user conditions
  • May not capture real-world bottlenecks
  • Single-point-in-time measurement

Both types of data are useful, but they serve different purposes. Field data tells you how your site is actually performing for users, while lab data helps you identify and fix specific issues.

When they conflict, prioritize field data—it's what your actual users are experiencing. But use lab data to guide your optimization efforts.

Common performance issues and how to fix them

Let's look at some of the most common issues flagged by PageSpeed Insights and how to address them:

1. Eliminate render-blocking resources

Render-blocking resources—typically JavaScript and CSS files—prevent your page from rendering until they're downloaded and processed.

Solution:

  • Use the async or defer attributes for non-critical JavaScript
  • Inline critical CSS and load non-critical styles asynchronously
  • Consider using the preload attribute for critical resources

2. Properly size images

Oversized images are one of the biggest performance killers I see in the wild.

Solution:

  • Resize images to the dimensions they'll be displayed at
  • Use responsive images with the srcset attribute
  • Consider a CDN that automatically optimizes images

3. Serve images in next-gen formats

Modern image formats like WebP, AVIF, and JPEG XL offer better compression than older formats like JPEG and PNG.

Solution:

  • Convert images to WebP (widely supported) or AVIF (best compression but less supported)
  • Use the <picture> element to provide fallbacks for browsers that don't support these formats

4. Minimize main thread work

When the browser's main thread is busy processing JavaScript, it can't respond to user interactions.

Solution:

  • Break long tasks into smaller chunks
  • Defer non-critical JavaScript
  • Use web workers for computationally intensive tasks

5. Reduce unused JavaScript and CSS

Many sites load JavaScript and CSS that they never actually use on the page.

Solution:

  • Implement code splitting to load only what's needed
  • Remove unused libraries or replace them with lighter alternatives
  • Use tools like PurgeCSS to eliminate unused CSS

6. Defer offscreen images

Loading images that aren't immediately visible in the viewport wastes resources.

Solution:

  • Implement lazy loading using the loading="lazy" attribute
  • Consider a library for more advanced lazy loading behavior

7. Preconnect to required origins

Establishing connections to third-party domains takes time.

Solution:

  • Use <link rel="preconnect"> for domains you know you'll need
  • For critical third-party resources, consider also using <link rel="dns-prefetch">

8. Enable text compression

Text-based resources like HTML, CSS, and JavaScript can be significantly reduced in size through compression.

Solution:

  • Enable Gzip or Brotli compression on your server
  • Most hosting providers make this easy through settings or plugins

9. Avoid excessive DOM size

Pages with thousands of DOM elements can be slow to render and interact with.

Solution:

  • Simplify your HTML structure
  • Use pagination or virtual scrolling for large data sets
  • Remove unnecessary div wrappers and containers

10. Ensure text remains visible during font loading

Custom fonts can cause a flash of invisible text (FOIT) or unstyled text (FOUT).

Solution:

  • Use font-display: swap in your CSS
  • Preload your font files
  • Consider using system fonts for better performance

For each of these issues, PageSpeed Insights will show you exactly which resources are causing the problem. Start with the issues that promise the biggest time savings and work your way down the list.

PageSpeed score myths and misconceptions

There are several misconceptions about PageSpeed Insights that I often hear from fellow developers. Let's clear them up:

Myth 1: You need a perfect 100/100 score

A perfect score is nice to have, but not necessary. Focus on getting into the "Good" range (90+) and passing the Core Web Vitals assessment. Beyond that, you'll often see diminishing returns for your efforts.

I've seen sites with scores in the 80s outrank sites with perfect 100s because they had better content and more relevant backlinks. Performance is important, but it's just one of many ranking factors.

Myth 2: Performance optimization is a one-time task

Performance optimization isn't something you do once and forget about. As you add features, content, and third-party scripts, your performance can degrade. I recommend running PageSpeed tests at least monthly and after any significant changes to your site.

Myth 3: All recommendations have equal importance

Not all PageSpeed recommendations are equally important. Focus on the ones that will have the biggest impact on your Core Web Vitals and overall user experience. Sometimes fixing one major issue (like an oversized image) can improve your score more than addressing several minor issues.

Myth 4: Lab data is more important than field data

Many developers focus on the lab data because it's more detailed and always available. But field data is what Google uses for ranking purposes and represents your actual users' experiences. When there's a conflict between the two, prioritize the field data.

Myth 5: A good PageSpeed score guarantees good SEO

While page speed is a ranking factor, it's just one of hundreds. A fast site with poor content won't outrank a slightly slower site with excellent content. Use PageSpeed Insights as one tool in your broader SEO strategy.

How Odown can help with performance monitoring

While PageSpeed Insights provides valuable snapshots of your site's performance, it's just as important to monitor your site's ongoing availability and speed. That's where Odown comes in.

Odown is a comprehensive website monitoring tool that tracks your site's uptime, performance, and SSL certificate status. Here's how it can complement your PageSpeed optimization efforts:

Real-time uptime monitoring

Even the fastest site is useless if it's down. Odown continuously checks your website and APIs, alerting you immediately if they become unavailable. This proactive approach means you can resolve issues before most of your users even notice them.

Performance tracking over time

While PageSpeed gives you a point-in-time assessment, Odown tracks your site's performance metrics over time. This historical data helps you identify trends and pinpoint when performance began to degrade, making it easier to correlate with changes you've made to your site.

SSL certificate monitoring

An expired SSL certificate can turn away users and damage your site's reputation. Odown monitors your SSL certificates and alerts you well before they expire, giving you ample time to renew them and maintain your site's security.

Public status pages

Transparency builds trust. Odown allows you to create public status pages that keep your users informed about any performance issues or planned maintenance. When users know you're on top of issues, they're more likely to return later rather than abandon your site permanently.

API monitoring

For developers, API performance is just as important as website performance. Odown can monitor your APIs for both availability and response time, ensuring that your applications remain fast and reliable.

By combining PageSpeed Insights for deep performance analysis with Odown for continuous monitoring, you can ensure that your site not only performs well today but continues to provide an excellent experience for your users over time.

Conclusion

PageSpeed Insights is an invaluable tool for understanding and improving your website's performance. By focusing on the metrics that matter—particularly the Core Web Vitals—you can create faster, more responsive websites that both users and search engines will love.

Remember, performance optimization is an ongoing process, not a one-time task. Regular testing and monitoring are essential to maintaining good performance as your site evolves.

And while PageSpeed Insights helps you identify and fix performance issues, tools like Odown can provide the continuous monitoring you need to ensure your site remains fast and available for all users. With its comprehensive suite of monitoring tools for websites, APIs, and SSL certificates, along with transparent public status pages, Odown gives you the peace of mind that comes from knowing your digital presence is always performing at its best.

The web keeps evolving, and user expectations for performance keep rising. Stay ahead of the curve by making performance a priority in your development process, and your users (and search rankings) will thank you.