A Slow Website - Time to First Byte (TTFB)
There are many reasons why your website may be slow. Time to first byte (TTFB), respectively time to last byte (TTLB), for the initial HTML document is one explanation we want to focus on in this post.
In most of the cases we talk about how to optimize our frontend such as minimizing CSS or compressing images. This is a very important aspect to have a fast loading website but there are good reasons to optimize the backend as well. Just imagine that there is a slow database query that delays the page download. Other scenarios are that your origin server reaches its limit due to inefficient code execution and slows down.
What is TTFB?
TTFB, which stands for time to first byte, is the amount of time it takes from when a client makes an HTTP request to it receiving its first byte of data from the web server. The time to first byte is made up of three separate components.
- The time needed to send the HTTP request.
- The time needed for the server to process the request.
- The time needed for the server to send back the first byte of the response to the client.
Why slow time to last byte of the HTML file results in bad user experience
A web browser gets first the HTML file that includes all the references to the assets, which need to be downloaded subsequentially. The browser will not start downloading any asset without the HTML file. Web browsers may start downloading assets while receiving first bytes of the HTML file. Therefore, time to first byte (TTFB) has an important role as well. However, in most cases, if not all, content on the website can be blocked from fetching until the HTML has been fully downloaded. Therefore, TTFB is as important as TTLB.
The slow backend problem
The following simplified example illustrates how a slow backend can lead to a delay for the download of the sub sequent assets. The full page speed tests have been performed using our Website Speed Test tool. The first example shows fast delivery of the HTML document without any delays.
In the following example, we manually added a 1 second delay to highlight the issue of a slow time to first byte. The assets starts downloading after the HTML document has been fully downloaded.
The difference between TTFB and TTLB is very small in this example, which eliminates connectivity issues or large geographic distance as potential problems. The issue has to be on the origin server. On average anything with a TTFB under 100 ms is fantastic. Anything between 200-500 ms is standard and anything between 500 ms and 1 s is less than ideal. Anything greater than 1 s should likely be investigated further.
What are the reasons for slow time to first and last byte?
It is crucial that you identify such issues quickly. Solving them might have a big impact on how you built your architecture or how your database design looks like. All following assets are affected by this delay. This indicates the importance on resolving slow website due to time to first byte issues.
Here is a list of the most common issues:
- Inefficient code on the origin server
- Database design results in slow queries (indexes, commits, stored procedures, etc.)
- Misconfigured webserver (Apache, Nginx, PHP, Ruby, MySQL, MongoDB, sysctl, etc.)
- The origin server reached its capacity (CPU, memory, disk i/o, etc.)
Time to first byte test
Our Performance Test tool is a great way to easily test TTFB on a single asset from 10 different locations around the wolrd. Simply input the URL of your asset and it will return the TTFB in addition to other helpful response data. Anything under 400 ms will return a green indicator. This time to first byte test can help you determine what locations you may be seeing slow performance.
A large delta between TTFB and TTLB is often caused by geographic distance or connectivity issues in general, which leads to increased latency and decreased throughput. This fact helps to differentiate the problems and isolate problem resolution.