Fix & Identify Time to First Byte (TTFB) issues

Learn how to debug the Time to First Byte issues on your pages and how to properly improve the TTFB

Arjen Karel Core Web Vitals Consultant
Arjen Karel
linkedin

Find and Fix Time to First Byte (TTFB) issues

In our previous article we talked about the Time to First Byte. If you would like to read up on the basics this is a great place to start!

In this article I will focus on identifying the different Time to First Byte issues and then explain how to fix them!

TTFB TIP: most of the time the TTFB will be much worse for first time visitors since they do not have a DNS cache for your site. When tracking the TTFB it makes a lot of sense to distinguish between first time and repeat visitors


Step 1: Check the TTFB in search console

"The first step to recovery is admitting that you have a problem". So before we do anything to fix the Time to First Byte let's make sure that we really have a problem with the TTFB.

Unfortunately the Time to First Byte is not reported in Google Search console so we need to fall back to pagespeed.web.dev to query the CrUX data of our site. Fortunately the steps are easy: just navigate to pagespeed.web.dev, enter the url of your page and make sure the 'origin' button is checked (since we need site-wide data and not just homepage data). Now switch between Mobile and Desktop and check the Time to First Byte for both device types

In the example below you will see a site that is failing the core web vitals because of a high TTFB.

ttfb crux pagespeed web dev

Step 2: Set up RUM tracking

The Time to First Byte is a tricky metric. We cannot simply rely on synthetic tests to measure the TTFB because in real life other factors will contribute to fluctuations in the TTFB. To get answers to all questions above we need to measure the data is real life and log any of the problems that might happen with the Time to First Byte. This is called Real User Monitoring and there are several ways to enable RUM trackingWe have developed Core/Dash just for these use cases. Core/Dash is a low cost, fast and effective RUM tool that just get's the job done! Of course there are many RUM solutions out there and they will also do the job (at a higher price though)

ttfb coredash new repeat visitor

How to think about the TTFB: Imagine a web server is a restaurant kitchen, and a user requesting a webpage is a hungry customer placing an order. Time to First Byte (TTFB) is the span of time between the customer placing their order and the kitchen starting to prepare the food.
So the TTFB is NOT about how fast the entire meal is cooked (First Contentful Paint) and served (Largest Contentful Paint), but rather how responsive the kitchen is to the initial request. 
RUM Tracking compares to surveying the customers to understand their dining experience. You might find that seated further away from the kitchen receive less attention from the waiter and get served later or that repeat customers get a preferred treatment while new visitors have to wait longer for a table 

Step 3: Identify Time to First Byte issues

While Google's Chrome User Experience Report (CrUX) provides valuable field data, it doesn't offer specific details about the causes of high TTFB. To effectively improve TTFB we need to know exactly what is going on at a more detailed level. At this point it makes sense to distinguish between overall failing TTFB and TTFB failing under specif conditions (although in reality there will always be a mix).

3.1 TTFB is failing overall

If the TTFB is failing overall we will need to look at the big picture and figure out which sub-parts of the TTFB we need to improve.
  1. Check for general poor 'request times': Poor request times means that the 'problem' is with the time it takes the server to generate the page. This is the most common cause for poor TTFB scores! 
  2. Check for other poor TTFB sub-parts: The TTFB is not just a single metric but can be broken down into multiple parts that have their own optimization potential. If the waiting duration, cache duration, DNS lookup duration or the connection duration are slow you would likely need to tune your server settings or start looking a better quality hosting. 
Take a look at this example RUM data. It clearly shows the TTFB is mostly affected by the 'Request Time'.  With this data we can now start improving the TTFB (for example by implementing caching, improving core quality, optimizing database response etc)

coredash rum ttfb breakdown pie and timeline

3.2 TTFB is failing under specific conditions

If the TTFB seems to be failing under specific conditions we need to understand what those conditions are in order to fix them. With RUM tracking it is easy to use segmentation to divide the TTFB  data into sub-groups based on specific criteria. Such criteria can be:
  1. Country segmentation: Understanding the geographical distribution of high TTFB is important, especially for websites with a global audience. If you are serving your pages from 1 server in just one country (without CDN edge caching ), the physical distance between the user's location and the server hosting the website will cause all sorts of delays and will impact the TTFB. 
    coredash ttfb rum country chart
  2. Cache segmentation: Caching can reduce TTFB, by skipping the server side generator of the HTML but it caching van be disabled or bypassed for many reasons. For example caching can be disabled for logged-in users, shopping carts pages, pages with query strings (e.g., from Google Ads), search result pages, and checkout pages. If your website uses (edge) caching use RUM tracking to check the cache hit ratio!
    coredash rum ttfb loggedin vs loggedout
  3. Page (cluster) segmentation: The difference in Time to First Byte performance (or the lack of difference) between pages or page types is another thing we need to determine. Knowing which pages fail the TTFB metric will give valuable insights in how to improve the time to fist byte. 
    ttfb coredash navigation path
  4. Redirect segmentation: Redirect time get's added directly to the TTFB. Each redirect adds extra time before the webserver can start loading the page. Measuring and eliminating unnecessary redirects can help to improve the TTFB.
    ttfb coredash redirect count 3
  5. Other segmentation: While segmenting by the above variables covers the usual suspects every site is unique and has it's own challenges. Fortunately RUM tracking is designed to allow segmentation by much more variables like Device RAM, Network Speed, Device Type, Operating system, custom variables and much much more. 
In CoreDash navigate to the TTFB page and on the data table switch between 'country', 'repeat visitor', 'logged in status', 'redirect count' to see if any of these filters show a difference in TTFB. If the TTFb between one group and another differ significant make a note because that is where there is room for improvement.

Step 4: Zoom in to problems and fix!

Now that we have identified problem area's it's time to zoom in and fix the issues. When using a RUM tracking tool (and there is really no way to measure time to first byte without RUM tracking) you can easily create filters to match the problem area's. In CoreDash for exampe you can create filters by just clicking on any of the segment values.Apply as many of the filters as needed and continue to look at the attribution data. The attribution details are show in the TTFB breakdown and show the TTFB's basic components.  From that breakdown CoreDash will show you which sub-parts of the TTFB should be optimized

ttfb coredash global breakdown


The sub-parts of the Time to First Byte (TTFB) are:

  • Waiting + Redirect (or waiting duration)
  • Worker + Cache (or cache duration)
  • DNS (or DNS duration)
  • Connection  (or connection duration)
  • Request (or request duration)
Each of the sub-parts has it's on set of challenges and solutions that I will address in separate articles!

I help teams pass the Core Web Vitals:

lighthouse 100 score

A slow website is likely to miss out on conversions and revenue. Nearly half of internet searchers don't wait three seconds for a page to load before going to another site. Ask yourself: "Is my site fast enough to convert visitors into customers?"

Fix & Identify Time to First Byte (TTFB) issuesCore Web Vitals Fix & Identify Time to First Byte (TTFB) issues