I’ll admit it—I’m a bit of a performance nut. There’s something satisfying about optimizing a website and beating my previous “high score.” Performance is one of the main reasons I chose the block editor and GenerateBlocks. These tools deliver excellent results right out of the box without the bloat that other page builders often add.
In this post, I want to focus on auditing and diagnosing performance issues. While tools like Perfmatters are great for fixing problems, today’s focus is on identifying what’s slowing your website down.
Why Core Web Vitals Matter
When it comes to measuring website performance, the main thing I care about is Core Web Vitals. Why? Because that’s what Google cares about.
Google has spent years analyzing performance metrics that provide the best user experience. These metrics are baked into their search ranking algorithm, meaning that improving your Core Web Vitals not only enhances user experience but also boosts your SEO.
Lighthouse vs. Core Web Vitals
Before diving into testing, it’s important to understand the difference between Lighthouse tests and Core Web Vitals.
Core Web Vitals
Core Web Vitals use real-world data collected from actual users visiting your website. This data is factored into Google’s search algorithm, making it the most impactful performance metric.
Lighthouse Tests
Lighthouse tests, on the other hand, use lab data—simulated tests that mimic user behavior. While Lighthouse tests aren’t as accurate as Core Web Vitals, they’re still incredibly useful, especially in two scenarios:
- New Websites: If your site is new or set to no-index, there’s no real-world data to analyze.
- Immediate Feedback: Core Web Vitals use a rolling average over 28 days, meaning changes you make today won’t show up for weeks. Lighthouse tests provide instant results, allowing you to see the impact of your changes right away.
While Lighthouse tests aren’t perfect, they’re close enough to Core Web Vitals to make informed decisions.
Tool #1: PageSpeed Insights
The easiest way to test both Lighthouse and Core Web Vitals is with PageSpeed Insights.
How to Use PageSpeed Insights
- Visit PageSpeed Insights.
- Enter your website’s URL and click Analyze.
- Review the results, which include both Lighthouse lab data and Core Web Vitals (if your site has enough traffic).
Core Web Vitals Metrics
PageSpeed Insights evaluates three primary Core Web Vitals:
- Largest Contentful Paint (LCP): Measures loading performance.
- First Input Delay (FID): Measures interactivity.
- Cumulative Layout Shift (CLS): Measures visual stability.
It also provides additional metrics like:
- First Contentful Paint (FCP)
- Interaction to Next Paint (INP)
- Time to First Byte (TTFB)
By default, PageSpeed Insights shows mobile scores, but you can switch to desktop scores if needed. Generally, if your site performs well on mobile, it will perform well on desktop too.
Lighthouse Lab Data
Below the Core Web Vitals section, you’ll find Lighthouse lab data. This includes metrics like:
- First Contentful Paint
- Largest Contentful Paint
- Total Blocking Time
- Cumulative Layout Shift
- Speed Index
Diagnostics and Opportunities
Under the Lighthouse report, you’ll find Diagnostics and Opportunities. These sections provide detailed insights into potential issues, along with links to resources for fixing them. While the information can be overwhelming at first, it’s incredibly helpful for identifying areas to improve.
Tool #2: GTmetrix
While PageSpeed Insights is my go-to tool, GTmetrix provides additional data that can be incredibly useful.
How to Use GTmetrix
- Visit GTmetrix.
- Enter your website’s URL and click Analyze.
- Sign up for a free account to unlock additional features, including:
- Testing Locations: Choose a data center closer to your audience for more accurate results.
- Data Retention: Save test results for up to two weeks, allowing you to track changes over time.
Key Features of GTmetrix
Speed Visualization
The Speed Visualization Chart provides a timeline of your page’s loading events, from the first byte to fully loaded. This helps pinpoint where delays occur in the loading process.
Page Details
The Page Details section breaks down:
- Total Page Size: Shows the size of your page, broken down by file type (e.g., images, JavaScript, CSS).
- Total Requests: Displays the number of requests made by your page, categorized by type.
For most sites, I aim to keep the total page size under 1MB and total requests under 30.
Waterfall Chart
The Waterfall Chart is one of the most powerful features in GTmetrix.
- Timeline: Displays each request made by your page, along with how long it took to load.
- Detailed Insights: Shows DNS lookup times, server response times, and resource loading times.
- Outliers: Helps identify problematic resources, such as slow-loading files or broken requests.
You can filter the chart by request type (e.g., JavaScript, CSS, images), making it easier to narrow down issues.
Practical Tips for Auditing
While testing is the easy part, fixing performance issues can be more challenging. Here are a few tips:
- Focus on Core Web Vitals: These metrics have the biggest impact on user experience and SEO.
- Use Diagnostics and Waterfall Charts: These tools help identify specific issues, such as slow server response times or oversized images.
- Set Benchmarks: Aim for a total page size under 1MB and total requests under 30, but adjust based on your site’s needs.
Wrapping Up
Auditing website performance doesn’t have to be complicated. With just two tools—PageSpeed Insights and GTmetrix—you can identify and diagnose most performance issues.
While it’s tempting to dive deeper into performance optimization, there’s a point of diminishing returns. The methods outlined here are practical for most use cases and will help you achieve significant improvements without overcomplicating the process.
Whether you’re building a new site or optimizing an existing one, these tools provide the insights you need to deliver a fast, user-friendly experience.
What’s your favorite tool for auditing website performance? Let me know—I’d love to hear your thoughts!