Skip to content
Alerty-Logo dk

How To Measure Page Load Time & 7 Tips To Optimize Page Load Time

What’s the first thing you do when a website takes too long to load? You probably guess what’s on the page and abandon it before it loads. 47 percent of web users expect a site to load in two seconds or less, and 60 percent will leave a site that takes longer than three seconds to load. This brief anecdote illustrates why measuring page load time is crucial to improving website performance. This article will explain how front end monitoring tools can help you measure page load time and optimize your site for improved performance and user experience.

One such frontend monitoring tool is Alerty's solution, which focuses on monitoring your users' real-world performance. This way, you can know precisely how long it takes for your website to load for your visitors and what might be causing delays.

Alerty-Logo dk

Table of Contents

What Is Page Load Time?

Search Console - Measure Page Load Time

Page load time is when a webpage loads completely and becomes fully usable after a user requests to view it. From the moment someone clicks a link or types in a URL, page load time starts ticking and includes everything the browser needs to display the page—like:

  • HTML
  • CSS
  • JavaScript
  • Images
  • Other resources

Load Time Metrics

A faster load time means users can interact with the page more quickly, while a slow load time can leave visitors waiting and frustrated. It’s a key factor for user experience and website performance, impacting:

  • Search engine rankings 
  • Customer satisfaction

A website's loading process will consist of multiple milestones, such as starting to show text or displaying a hero image. There isn’t one single metric that measures page load time. When you see page load times reported, determine what specific metric is being calculated.

What Is a Good Page Load Time?

According to Google’s Core Web Vitals, a Largest Contentful Paint of 2.5 seconds or below is a good page load time. Page load times up to 4 seconds are acceptable, and Google will flag them as “Needs Improvement.” A page load time over 4 seconds is slow, and Google will rate it as Poor.

Why Is Page Load Time Important?

Web Analytics - Measure Page Load Time

Your website's page load time heavily influences its SEO performance. Google includes page speed as one of the ranking factors in its algorithm. When faced with two websites offering the same information, users naturally prefer the faster option.

Google knows this and aims to deliver its users the best, most relevant, and quickest results. If your site is slow, it will hurt your:

  • SEO efforts 
  • Bottom line

User Engagement and Customer Satisfaction Are Directly Affected by Speed

Page load time affects how users experience your website. The slower your site, the more frustrated visitors become. 

Studies show that over 70 percent of consumers say that page speed influences their willingness to purchase. If your site is fast, nearly half of those users will likely return or make a purchase.

Slow Websites Lead to High Bounce Rates

A slow website encourages visitors to leave before the page even finishes loading. Google found that the chance of someone leaving jumps by 32 percent when the load time is 1 to 3 seconds and skyrockets to 123 percent if it takes more than 10 seconds. Faster load times keep users engaged and decrease the likelihood of abandoning your site.

A Slow Website Can Hurt Your Business' Bottom Line

Every second counts when it comes to conversion rates and revenue. A slow-loading website can cost you potential customers. 40 percent of users will abandon a site that takes longer than 3 seconds to load. Each additional second of delay can reduce your conversion rates by about 7 percent, directly affecting:

  • Sales 
  • Leads

Users Now Expect Faster Load Times Than Ever

With the ongoing global rollout of 5G technology and the rise of edge computing, users' expectations for website performance are higher than ever. These technologies promise:

  • Significantly faster load times 
  • Lower latency

Sustainable Websites Are Optimized for Speed

There's an increasing awareness of digital technologies' environmental impact. More data means more energy consumed, so an optimized, efficient website could also be a more sustainable choice, reducing its carbon footprint.

Speed Helps Websites Handle Growth and Scalability

Your website will have more users, page views, and content as it grows. If your website is already slow, growth will only exacerbate the problem.

Optimizing your website's speed ensures that it can handle the increased traffic and content as you grow and scale.

A Fast Website Can Give You a Competitive Advantage

A faster website can give you a competitive advantage. If your website is faster than your competitors, you're more likely to retain and attract users. 

Speed can be a key differentiator in the online world, where users can go from one site to another in seconds.

Related Reading

What Is The Average Speed Of A Website?

Person Pointing at Laptop - Measure Page Load Time

According to Google's CrUX dataset, the largest content takes 2.6 seconds to show up on mobile devices. Desktop sites are slightly faster, with the Largest Contentful Paint of 2.3 seconds. A standard page load time for real users is in the 2- to 3-second range.

Another aspect of page speed is how long it takes for a page to respond to user input. This is measured using the Interaction with the Next Paint metric. On mobile, the average INP is 274 milliseconds.

On desktop, users only wait 108 milliseconds for the page to respond to user interaction. These numbers look at the 75th percentile of experiences, meaning 25% of users wait longer than the reported value, while 75% don't stay as long.

Early Issue Detection with Alerty

Catch issues before they affect your users with Alerty's free APM solution today!

JS logo

Related Reading


How Is Page Load Time Different From Response Time?

Person discussing - Measure Page Load Time

Page load time and response time are often confused, but they refer to two different parts of the user’s experience on a website. Response time is all about how quickly a server reacts to a request. When someone clicks a link, the server must respond before anything on the page can start loading. 

Server & Page Load Times

This involves DNS lookup, establishing a connection, and delivering the first byte of data (known as the time to first byte). All of these steps make up the server’s response time. On the other hand, page load time refers to how long it takes for the entire webpage to load and be fully usable.

Once the server responds, the browser must fetch all the page elements:

  • Images
  • Scripts
  • Stylesheets

Resource Impact

The longer it takes to gather all these resources, the longer the page load time. The two are connected: if the server takes a long time to respond, it will naturally slow the page load time.

But even with a fast server response, a page can still load slowly if it has too many large elements or poorly optimized assets. Monitoring both metrics helps ensure your site runs smoothly and provides a good user experience. 

How Does The Browser Load A Web Page?

Person Using Laptop - Measure Page Load Time

Web pages don't just materialize on a user's screen when they navigate to a URL. The browser runs complex operations to load and display the page before the user can interact with it. This process can be broken down into several steps:

The User Clicks a Link or Inputs a URL

The process begins when users click a link or type a URL into their browser. They may be seeking information, purchasing, or accessing a web app. No matter the reason for their visit, this user is likely impatient and wants the page to load as quickly as possible.

The Browser Accesses a DNS Server

Next, the browser accesses a Domain Name System (DNS) server to identify the IP address represented by the web address. This step translates the site’s URL into a language the browser understands, allowing it to access the correct files.

The Browser Sends an HTTP Request to the Server

After the DNS lookup, the browser sends a request to the server where the web page is hosted using the Hypertext Transfer Protocol (HTTP).

The Server Responds

The server responds by sending back the web page’s files, including:

  • HTML
  • CSS
  • JavaScript
  • Images
  • Other content

The Browser Starts Parsing HTML

Once the browser receives these files, it starts parsing the HTML, which is the backbone of the web page. The HTML includes instructions for loading other resources, like:

  • CSS for styling 
  • JavaScript for functionality

The browser also renders images and other media as instructed by the HTML.

The Browser Builds the DOM

While this process occurs, the browser also builds the Document Object Model (DOM), which represents the web page’s structure. Once the DOM is complete, the web page is considered fully loaded.

How Do I Check the Time Load On My Page? Measuring Page Load Time

Web Analytics - Measure Page Load Time

Time To First Byte (TTFB): Why It Matters and How to Measure It

The Time to First Byte (TTFB) is a critical metric for page load time. TTFB is the duration from the client making an HTTP request to the moment the client receives the first byte of data from the server.

TTFB Optimization

This measure reflects the responsiveness of your web server and the network connectivity between the client and the server. A high TTFB can indicate problems with the:

  • Server setup
  • Network issues
  • Inefficient application logic

By optimizing these areas, you can significantly reduce TTFB and improve your overall page load time.

Round-Trip Time (RTT): Why It Matters and How to Measure It

The Round-trip time (RTT) is an essential measure of latency, the time taken for data to travel from the source to the destination and back. This measure can give us a fair idea of how quickly a web page will load for a user, depending on their geographical location and the location of the server hosting the web page.

The longer the RTT, the longer it takes for the page to start loading, leading to a slower page load time. By measuring RTT for your web pages under realistic conditions, you can make informed decisions about server locations and the need for a Content Delivery Network (CDN). The closer the server to your end users, the lower the RTT and the better the page load times.

Core Web Vitals: Google’s Page Load Time Metrics

Google’s Core Web Vitals are specific factors that Google considers important in a webpage’s overall user experience. These metrics are part of Google’s page experience ranking factor, and are instrumental in:

  • Understanding 
  • Improving page load time. Two Core Web Vitals metrics that are closely related to page load time are:

Largest Contentful Paint (LCP)

This metric marks the point in the page load timeline when the main content has likely loaded. A fast LCP helps reassure the user that the page is useful. For a good user experience, LCP should occur within 2.5 seconds of the page first starting to load. 

LCP is influenced by:

  • Server response time
  • Render-blocking JavaScript and CSS
  • Resource load times
  • Client-side rendering

First Input Delay (FID)

Measures interactivity. It quantifies the user experience when trying to interact with unresponsive pages. A low FID means the page is more interactive and responsive to user input. To provide a good user experience, pages should have an FID of less than 100 milliseconds. 

Improving FID involves:

  • Minimizing (or deferring) JavaScript
  • Removing unnecessary third-party scripts
  • Using a web worker

Several factors are considered when measuring web page load time. Website owners can affect some of these, while others, such as the user’s location, device, browser, and internet connection, are beyond their control yet still affect the page load time. 

The same web page can load differently on different browsers (e.g., Firefox, Chrome) and devices (e.g., desktop vs. tablet vs. mobile) and in other locations.

Vector

How To Optimize Your Page Load Time

Google Search Console - Measure Page Load Time

Optimize Your Code: Eliminate Unnecessary Files to Improve Load Times

Messy or bloated code can slow down your site. To speed things up, reduce render-blocking resources like:

  • Unnecessary scripts 
  • Stylesheets
  • Tools that minify your code, such as removing whitespace and comments

Optimizing how different elements load (like images and scripts) can also improve speed.

Choose Better Hosting: How Your Web Hosting Affects Speed

If you're using a low-cost hosting plan, you might be sacrificing performance. A better hosting plan, especially one optimized for speed, can significantly improve how fast your pages load.

Optimize Your Files and Media: Reduce the Size of Your Website's Files

Large files are often the main culprits for slow load times. To speed things up, compress images and other media and ensure you’re using the right formats. JPEG is great for photos, while PNG works well for simple graphics. You can adjust image resolution based on the user’s device for a more tailored approach.

Reduce HTTP Requests: Fewer Requests Mean Faster Load Times

When a browser requests files from your server, such as an image, script, or stylesheet, it takes extra time. To minimize this, eliminate unnecessary files and try to combine resources where possible. Less clutter equals faster loading.

Cut Down on Plugins: Too Many Plugins Can Hurt Performance

Plugins can add much functionality, but too many can slow down your site. Deactivate any you’re not using and consolidate those offering similar features. Running plugins one by one can also help you pinpoint the ones slowing down your site.

Use a CDN (Content Delivery Network): Speed Up Load Times for Users Far Away From Your Server

A CDN helps by caching your site’s data on servers worldwide. By serving your content from a geographically closer location, you can reduce the time it takes for users to reach it.

Monitor Performance Continuously: Keep an Eye on Your Website's Performance Over Time

Cloud-based monitoring tools can give you a real-time view of your website's performance. These tools let you spot trends and patterns, such as slower load times during peak hours, so you can address issues before they become bigger problems.

7 Best Tools To Measure Website Load Time

Webpage Analytics - Measure Page Load Time

1. Get Alerted on Performance Issues with Alerty

Alerty is a cloud monitoring service for developers and early-stage startups, offering:

  • Application performance monitoring
  • Database monitoring
  • Incident management

It supports technologies like NextJS, React, Vue, and Node.js, helping developers identify and fix issues. 

  • Alerty monitors databases such as Supabase, PostgreSQL, and RDS
  • Tracking key metrics like CPU usage and memory consumption
  • It features quick incident management and Real User Monitoring (RUM) to optimize user experience
  • Its universal service monitoring covers dependencies like Stripe API, OpenAI, and Vercel

Alerty uses AI to simplify setup, providing a cost-effective solution compared to competitors. It is designed for ease of use, allowing quick setup, and integrates with tools like Sentry, making it ideal for developers and small teams needing efficient, affordable monitoring.

Catch issues before they affect your users with Alerty's free APM solution today!

2. Understand Performance with GTMetrix

GTMetrix is a leading free online speed test that's ideal for beginners. The publicly available version of the test does an excellent job of breaking down performance while simplifying things. When your test is complete, you'll receive two main scores:

  • Performance, which GTMetrix states is basically your Google Lighthouse performance score combined with some of its custom assessments 
  • Layout, which grades how well your page is built for performance.

GTMetrix also breaks down results in several other ways, including”

  • A speed visualization that displays your page load as a timeline of screenshots at each core web vital, 
  • A structured assessment showing where to optimize your page.
  • Waterfall chart recording the loading time of each object on the page.

Advanced Testing

Log in if you want to perform multiple tests across various browsers, locations, and connections. Your free account will save your previous 20 tests and associated data. Compare data across different tests and download the generated waterfall charts to help you find anything slowing down your website.

3. Get Google’s Take on Your Speed with PageSpeed Insights

If you're trying to boost website speed and, by extension, SEO, you'd turn to a search engine for help. Google PageSpeed Insights is a popular website speed testing tool that scores your site speed on a scale from 0 to 100. The higher the score, the better your website is performing.

Even better, it's free. To account for your mobile traffic, Google PageSpeed Insights can generate tests for your desktop and mobile websites. The best part is that your score is followed by suggestions to improve your site's performance, some of which you can implement right away.

Core Web Vitals

PageSpeed Insights tests your website against Google's core web vitals, breaking down the time it takes to reach each page-loading stage. Core web vitals allow a more nuanced understanding of your page load and how it impacts user experience.

4. Test Your Site Speed with Pingdom

Like Google PageSpeed Insights, the Pingdom page speed test ranks your website speed from 0 to 100, but this tool is easier to navigate and better for beginners. You can test your website based on location, and it will provide your:

  • Performance grade
  • Page load time
  • Page size
  • Content size (broken down by content type)
  • The total number of requests
  • Offer suggestions for improving speed

Detailed Analysis

It's also easy to re-run a test by clicking the screenshot of your page. Pingdom offers more detailed analyses to help anyone, from novice to expert, troubleshoot problems and make changes quickly.

Each of your site's seven load time criteria gets a letter grade and a simple explanation to help you prioritize the most critical areas of improvement.

5. Monitor and Test Speed with Sematext

Sematext is a unique DevOps tool that combines all aspects of website monitoring. It provides Sematext Synthetics, real-time alerts, and debugging solutions, support for all major frameworks, and end-to-end visibility and observability.

The Sematext Synthetics feature allows you to test website speed across multiple locations and devices. Sematext's website performance monitoring tools are also relevant. You can track core web vitals and other key performance metrics, get visualizations to pinpoint what aspects of your site need improvement, and even benchmark your site's performance against competitors.

6. Check Your Mobile Speed with Google

Now that mobile users account for more than half of all global web traffic, it's more important than ever to have a:

  • Mobile-friendly
  • Responsive
  • Fast website

Google's mobile site speed testing tool analyzes your mobile site speed, quickly notifies you of load times, and offers recommendations to increase speed on mobile devices. Type in your domain, and Google will tell you your mobile site speed in seconds — change the location and connection (it defaults to 4G) for more details.

Optimization Tips

As you scroll through the report, Google offers several tips for optimizing your website to improve:

  • Conversion rates 
  • Sales

If you scroll to the bottom, you'll also have the option to download a free report of your findings, which you can share with your team. All in all, it's a handy tool to check your site's mobile speed.

7. Get Detailed Insights with WebPageTest

Created by a Google Chrome engineer, WebPageTest is a free site speed testing tool with more advanced data and insights than many other free tools offer (although there's also a simple test option if you're looking for something more straightforward).

Test your website speed across various browsers, devices, and locations, and the tool will even generate reports and insights to identify issues and improve site speed. WebPageTest is also unique in that it frames its performance summary as questions. Some of these include:

  • Is it quick?
  • Is it usable?
  • Is it resilient?

Detailed Breakdown

The tool asks these questions because they contribute to your website's user experience. The answers to each are phrased in an accessible way, making it an exceptional option for those slightly overwhelmed by page speed test options.

Scroll down, and you'll see a detailed breakdown of page performance. There's a visual page load timeline, a waterfall chart, videos of the page load, and an overview of core web vitals. The test even shows your results from each of the three times it loads your page during a test.

Catch Issues Before They Affect Your Users with Alerty's Free APM Solution

Alerty is a cloud monitoring service designed for developers and early-stage startups. It offers application performance monitoring, database monitoring, and incident management. With supporting technologies like:

  • NextJS
  • React
  • Vue
  • Node.js, Alerty helps developers identify and fix issues

Monitor Databases and Real User Performance

Alerty monitors databases such as:

  • Supabase
  • PostgreSQL
  • RDS tracking key metrics like CPU usage and memory consumption

It features quick incident management and Real User Monitoring to optimize user experience. Its Universal Service Monitoring covers dependencies like:

  • Stripe API
  • OpenAI
  • Vercel

Benefits of Using Alerty

Alerty uses AI to simplify setup, providing a cost-effective solution compared to competitors. It is designed for ease of use, allowing quick setup. Alerty integrates with tools like Sentry, making it ideal for developers and small teams needing efficient, affordable monitoring.

Related Reading

Group 21