Website Speed Test: How to Check and Improve Your Load Time

Why Website Speed Matters More Than Ever

Google confirmed that Core Web Vitals are ranking signals. A slow site loses positions in search results to faster competitors. But rankings are only part of the story.

Amazon calculated that every 100 milliseconds of added load time cost them 1% in sales. While your business may not operate at Amazon’s scale, the principle holds. Research from Google shows that as page load time increases from 1 to 3 seconds, bounce probability increases by 32%. At 5 seconds, that number jumps to 90%.

The connection between website speed and revenue is direct and measurable. Every second of delay reduces page views, customer satisfaction and conversion rates. Speed optimization is not a nice-to-have. It is a revenue driver.

Mobile Performance Is the Priority

Google uses mobile-first indexing, meaning it evaluates the mobile version of your site for rankings. Over 60% of web traffic comes from mobile devices. Mobile users face additional constraints: smaller processors, less memory and often slower network connections. A site that loads in 1.5 seconds on desktop may take 4+ seconds on a mid-range smartphone over a 4G connection.

How to Run a Website Speed Test

Use multiple tools to get a complete picture. Each tool measures slightly different things and provides unique insights.

Google PageSpeed Insights

PageSpeed Insights (PSI) is the most important tool because it uses the same data Google uses for ranking. It shows two types of data:

• Field data: Real-user metrics from the Chrome User Experience Report (CrUX). This is what Google uses for ranking. It shows LCP, INP, CLS and other metrics from actual visitors to your site over the past 28 days.
• Lab data: Simulated test results from Lighthouse. These provide specific diagnostic information and improvement suggestions.

Enter your URL at pagespeed.web.dev and test both mobile and desktop versions. Focus on field data for ranking impact and lab data for diagnostic guidance.

GTmetrix

GTmetrix provides a detailed waterfall chart showing every resource your page loads, its size and how long it takes. This visual timeline reveals exactly which files slow your page down. GTmetrix also tracks historical performance so you can see how changes affect speed over time.

WebPageTest

WebPageTest offers the most advanced testing options. You can test from different geographic locations, different browsers and different connection speeds. The filmstrip view shows your page rendering frame by frame, making it easy to identify what users see at each stage of loading.

Chrome DevTools

Open Chrome DevTools (F12), go to the Network tab and reload your page. The waterfall shows every request with timing data. Enable throttling to simulate slow connections. The Performance tab records a detailed trace of rendering activity. This tool is essential for debugging specific performance issues.

Understand Core Web Vitals

Core Web Vitals are the three metrics Google considers most important for user experience. Understanding what each measures helps you prioritize fixes. For a deeper exploration of each metric, read our Core Web Vitals guide.

Largest Contentful Paint (LCP)

LCP measures when the largest visible element in the viewport finishes rendering. This is usually a hero image, heading block or large text paragraph. Google wants LCP under 2.5 seconds.

Common LCP problems:

• Slow server response time (TTFB over 800ms)
• Render-blocking JavaScript and CSS
• Large unoptimized images
• Client-side rendering that delays content display
• Web font loading that blocks text rendering

Interaction to Next Paint (INP)

INP replaced First Input Delay in March 2024. It measures the latency of all user interactions throughout the page visit, then reports the worst interaction (at the 98th percentile). Google wants INP under 200 milliseconds.

Common INP problems:

• Heavy JavaScript execution blocking the main thread
• Large DOM sizes that slow event handlers
• Third-party scripts competing for processing time
• Inefficient event listeners and handlers

Cumulative Layout Shift (CLS)

CLS measures unexpected layout movement during the page’s lifetime. When elements shift after loading, users click the wrong buttons, lose their reading position and get frustrated. Google wants CLS under 0.1.

Common CLS problems:

• Images without explicit width and height attributes
• Ads or embeds that inject content without reserved space
• Web fonts causing text to reflow (FOUT/FOIT)
• Dynamically injected content above existing content

Fix Server and Hosting Issues

Your server is the foundation. No amount of front-end optimization compensates for a slow server.

Time to First Byte (TTFB)

TTFB measures how long your server takes to send the first byte of response. Aim for under 200ms on desktop, under 800ms on mobile. If your TTFB exceeds these targets, investigate your hosting, database queries and server-side processing.

Upgrade Hosting When Needed

Shared hosting packs hundreds of sites on a single server. When your neighbors have traffic spikes, your performance suffers. VPS, cloud or managed WordPress hosting provides dedicated resources and consistent performance. The $20-50/month difference between shared and quality managed hosting pays for itself in conversions.

Enable Server-Level Caching

Server-level caching stores generated HTML pages so the server does not rebuild them for every visitor. Technologies like Varnish, Redis and LiteSpeed Cache reduce server processing time by 80-95%. Your hosting provider should offer caching at the server level. If not, consider switching providers.

Use a Content Delivery Network (CDN)

A CDN caches your static files on servers around the world. Visitors load files from the nearest server instead of your origin server. Cloudflare’s free tier provides global CDN coverage and reduces latency for distant visitors significantly. For a Canadian business serving Canadian visitors, a CDN still helps by reducing load on your origin server.

Optimize Images for Speed

Images typically account for 50-80% of total page weight. Image optimization delivers the biggest speed gains with the least effort.

Use Modern Formats

WebP delivers 25-35% smaller file sizes than JPEG at equivalent quality. AVIF offers even better compression. Use the <picture> element to serve modern formats with fallbacks:

<picture>
  <source srcset="hero.avif" type="image/avif">
  <source srcset="hero.webp" type="image/webp">
  <img src="hero.jpg" alt="Description of the image"
    width="1200" height="630" loading="lazy">
</picture>

Resize and Compress

Never serve a 3000px image in a 600px container. Resize images to the maximum display size. Compress with tools like Squoosh, ShortPixel or Imagify. Target 80-85% quality for photographs. Most users cannot distinguish between 85% and 100% quality JPEG.

Implement Lazy Loading

Add loading="lazy" to all images below the fold. This delays loading until the image enters the viewport, reducing initial page weight. Do not lazy-load your hero image or LCP element. Add fetchpriority="high" to your LCP image instead.

For comprehensive image optimization guidance aligned with your WordPress site, see our WordPress performance optimization guide.

Reduce JavaScript and CSS Bloat

Every kilobyte of JavaScript and CSS adds to download time, parsing time and rendering time. JavaScript is especially expensive because the browser must download, parse, compile and execute it.

Audit Your Scripts

Open Chrome DevTools Coverage tab (Ctrl+Shift+P, type “coverage”). This shows how much of each script and stylesheet is actually used on the current page. Sites running WordPress with multiple plugins commonly load 500KB+ of unused JavaScript.

Remove Unused Plugins and Scripts

Deactivate and delete plugins you do not use. Audit remaining plugins for performance impact. Tools like Query Monitor for WordPress show which plugins add the most load time. Replace heavy plugins with lightweight alternatives or custom code.

Defer Non-Critical JavaScript

Add defer to script tags that do not need to execute during page parsing. Add async to scripts that can load independently. Move analytics, chat widgets and social sharing scripts below the fold or load them after the main content renders.

Inline Critical CSS

Extract the CSS needed to render above-the-fold content and inline it directly in the HTML <head>. Load the remaining CSS asynchronously. This eliminates render-blocking CSS and lets the browser paint content faster.

Optimize Web Fonts

Custom fonts add visual identity but often hurt performance. A single font family with four weights can add 200-400KB to page weight.

Limit Font Weights and Styles

Load only the weights and styles you actually use. Most sites need regular (400) and bold (700). If you also use light (300) or semibold (600), question whether the design truly requires them.

Use Font-Display: Swap

Add font-display: swap to your @font-face declarations. This tells the browser to display text immediately using a fallback font, then swap in the custom font when it loads. Users see content instantly instead of staring at invisible text.

Self-Host Fonts

Hosting fonts on your own server or CDN eliminates the extra DNS lookup and connection to Google Fonts. Download font files, convert to WOFF2 format (the most compressed web font format) and serve them from your domain.

Set Up Ongoing Speed Monitoring

Speed optimization is not a one-time task. New content, plugins, theme updates and third-party script changes can degrade performance at any time.

Automated Monitoring Tools

Set up scheduled tests in GTmetrix, SpeedCurve or Calibre to track performance trends. Configure alerts for when metrics exceed your thresholds. Monthly monitoring at minimum catches regressions before they affect rankings.

Real User Monitoring (RUM)

Lab tests simulate conditions. RUM measures actual visitor experiences. Google’s CrUX data in PageSpeed Insights provides free RUM data. For more granular monitoring, implement tools like web-vitals.js to collect Core Web Vitals data from every visitor and report it to your analytics platform.

Performance Budgets

Set hard limits for page weight, JavaScript size and load time. Enforce these budgets in your development workflow. When a new feature would exceed the budget, optimize existing assets to make room or decline the addition.

Want to know exactly what is slowing your site down? Request a free audit and we will run a full performance analysis with prioritized recommendations.

Frequently Asked Questions