How to reduce TTFB to improve page load times

Published:

Last updated:

a bad performance website
Home » Articles » Web Performance » How to reduce TTFB to improve page load times

As your website grows, the amount of resources it uses increases too. If you don’t work on reducing the load time, it will get slower and slower. This can lead to losing a lot of traffic and potential customers.

One of the important metrics you need to minimise is Time to First Byte (TTFB). So, what is TTFB? Why does it affect your website’s speed? And how can you reduce it to make your website load faster? This article will answer your questions about TTFB.

What is Time to First Byte (TFFB)

Time to First Byte (TTFB) is a key measure of how quickly a server starts to respond to a request. It helps us understand if a server is slow to reply. When you request a webpage, especially HTML files, TTFB is the first metric to consider before any other loading times.

TTFB is the time from when you request something until the first piece of data comes back.

Here’s a breakdown of the steps involved in getting a resource and their times. TTFB covers the time from the start to when you get the first byte back. It includes:

  • Navigation time (time to find the right page)
  • Service worker startup time (if there’s one running)
  • Domain name resolution (figuring out the server’s address)
  • Connection setup and security handshake (connecting and ensuring it’s secure)
  • Sending the request and waiting for the first byte of the response

How does TTFB affect SEO?

Overall, Time To First Byte (TTFB) affect in three aspects of SEO which are website performance, website index and user experience. Search engines like Google use loading speed when scanning sites. A slow TTFB can make it hard for search engines to read and index your content. Plus, Google considers site speed in its rankings. Sites with fast TTFB are more likely to rank higher in search results. Either uses are using smartphones or computer to browse yoursite, a fast TTFB ensures a smooth experience on desktop or mobile devices

How to measure TTFB

Keeping an eye on TTFB regularly is crucial for ensuring your website’s performance stays top-notch. Here are some free tools you can try out:

Google Chrome DevTools

DevTools is an effective and user-friendly tool for measuring the TTFB metric. To get the most accurate results, it’s better to measure from a third-party source to avoid being influenced by your own network connection.

Here’s how you can do it:

1. Select More Tools > Developer Tools from the Chrome Menu.

2. Right-click on any part of the webpage and choose Inspect.

3. Alternatively, you can use the keyboard shortcuts Ctrl+Shift+I (Windows) or Cmd+Opt+I (Mac).

4. From there, you can open the network window and observe the performance of your website.

WebPageTest

   – Go to WebPageTest (https://www.webpagetest.org/).

   – Enter the URL of the website you want to test in the “Start a site performance test”

   – Select the suggested location, browser and internet connection for testing.

   – Click on “Start Test.”

   – After the test completes, you can view the TTFB among other performance metrics.

metrics of website performance

GTMetrix

   – Go to GTMetrix (https://gtmetrix.com/).

   – Enter the URL you want to test in the “analyze” bar

   – Start the test.

   – When the test completes, you can view the TTFB along with other performance metrics.

metrics on gtmetrix

Navigation Timing API

If you’re interested in a more technical approach to measuring TTFB and resource requests, you can explore the Navigation Timing API. This tool provides detailed insights into how your website loads and performs.

For a clearer understanding, you can check the technical method web.dev. It explains how to use the Navigation Timing API in a more user-friendly way, so even those who aren’t super technical can grasp the concept and its benefits.

How to reduce TTFB to improve page load times 

Here are 8 ways to reduce your website’s server response time (TTFB):

Use a Fast Web Hosting Service

Choosing a cheap web hosting service might save money at first, but it usually means slower website performance because you’ll be sharing server resources with many others

To get the lowest TTFB score,  think about these things when picking a web hosting service:

  • Pick a provider with data centers near your target audience to boost speed and response time.
  • Pick a web hosting package with high CPU capacity and RAM. The cost will of course be higher, but if TTFB is important to you, you should be able to justify the investment. Be careful not to overprovision and remember that some of the other steps outlined in this article can also make a big difference, even with a low power/average server.
  • Ensure the server can handle your website’s needs, especially if your site has a lot of visitors

Use a CDN (Content Delivery Network)

A CDN spreads your website content across a network of servers around the world. When someone visits your site, the CDN sends their request to the closest server.

This reduces the delay in transferring data between the user and the server, making your website load faster. CDNs also offer better security, improved performance, and more uptime, which is important for websites with lots of visitors or global audiences. You can consider these well-known CDN providers include Google Cloud CDN and Cloudflare.

By default, CloudFlare only stores static data like CSS, JS, and images on their CDN. They don’t store HTML files. When a user’s web browser asks for a webpage, some of the request is handled by CloudFlare’s servers (for static data), and the rest is handled by the hosting server (for HTML and other “dynamic” data). Caching all data simply means storing all static, HTML, and other components on CloudFlare’s servers. All requests are handled entirely by CloudFlare’s servers, making the response time to the user’s web browser faster (lower TTFB). Caching all data is particularly suitable for static websites (with rarely changing content or minimal user interaction).

Optimise Your Database

As databases get bigger over time, they can become slow and inefficient. To speed them up, you can delete unnecessary data, reduce the database size, and improve the structure. The faster the database works, the quicker the server can respond to users.

The best way to optimize a database depends on the type of database and the tools you use. Web servers often come with tools like phpMyAdmin or cPanel, which make it easy to manage and optimize databases. Advanced users can also write custom scripts to automate these tasks.

If you are managing a WordPress site, what you can do: 

– Deleting unnecessary data like old post revisions and spam comments.

– Compressing and defragmenting database tables.

– Removing trash folders.

– Automating regular database clean-ups.

Compress Files

Websites have lots of different types of data and features, which can make the files bigger and increase TTFB (Time to First Byte).

Compressing these files can help them load faster. Gzip is a common tool that compresses HTML, CSS, and JavaScript files efficiently.

Monitor PHP Usage

PHP scripts run on your server and can use a lot of resources, which might slow down your website.

Make sure your PHP scripts don’t use too much memory or CPU. Avoid unnecessary database queries and use caching to speed things up.

Old PHP versions can be a security risk. Some hosting companies don’t update PHP automatically, so you might need to do it yourself.

You can check your PHP version using the command line or PHP code. Upgrade to a newer version through cPanel or by asking your hosting provider.

Configure Caching

When people browse websites, they often ask for the same things over and over again. You can save these common requests and the server’s responses in a cache. This means the server can just give out the saved content instead of doing the same work again.

Here are some ways to do caching:

  • Save the results of common database searches so you don’t have to keep searching.
  • Keep full web pages ready to go in the cache so they load faster.
  • Tell web browsers to save certain files on the user’s device so they don’t have to download them again.
  • Guess what users might do next and get ready with the right content in advance.
  • Save the results of complicated math or other tasks so you don’t have to do them over and over.

Website managers can use plugins to set up caching easily. Some popular ones for WordPress are WP Rocket, WP Super Cache, and W3 Total Cache.

Minimise Scripts

Minification is like tidying up your code to make it smaller and load faster. It gets rid of stuff like extra spaces, comments, and long names that you don’t really need for the code to work.

For websites, things like JavaScript (JS) and CSS files can slow down how fast the page loads. Minifying and compressing these files helps speed things up.

To make your website load faster and work better:

  • Put small bits of code directly into the main page so they load quickly.
  • Keep bigger files separate to help them load faster and be saved in the cache for later.

This way, your website can still have big files without making it slow.

Use a good DNS

Before a user can connect to your server, they need to be routed by your DNS. Your DNS is kind of like a telephone operator that routes calls. If you are using a poor quality DNS or one that doesn’t have a lot of locations distributed around the world, near your users, then your TTFB will be slower. We’d recommend considering using a professional DNS solution such as Cloudflare. The good thing is that you can use a good quality DNS in tandem with some average or cheap web hosting, and still see some performance gains. By making this first step faster, you can improve your TTFB.

Conclusion

Speed really does matter. Having beautifully designed and insightful content won’t be effective if your site is slow. By improving TTFB (Time to First Byte), you can achieve much better site speed performance. There are other important metrics in terms of website performance that Kahunam will cover soon on this blog for you. Stay tuned for upcoming articles!

Contact Us