I’ve been doing some performance optimisation on a WordPress site recently (something I often do for clients) and was once again asked why I was suggesting a move to a different webhost – am I just trying to earn commission?  Well, in short, no.  Your webhost is actually a really big factor in the overall performance of your website.

The biggest impact they have is on Time To First Byte (or TTFB).  This is the time it takes to do a complete round trip…

1. The time it takes for the request to get from the user’s browser to your server
2. The time the server takes processing the request and producing the response
3. The time it takes for the response to get back to the user’s browser

The part that I’m discussing in this post is the second part, the time the server takes to do it’s job.  But when we open up our developer tools, all we see if “Waiting (TTFB)” and no details…

That green line isn’t particularly helpful for telling us how much time we’re spending in each of the 3 phases above, or what we can do about it.  So what can we do to break this down?

The answer is to use the Server-Timing header.

This header can be set in a number of ways, but I think the most useful is in this format:

Server-Timing: Total;dur=100

In this example the header is stating that the total execution time is 100ms.

So in order to measure the second phase above, the server time, we need to capture the start time right at the beginning of our application code, and then also capture it at the end, calculate the difference and then set the header.

This gives us some extra information in the developer console…

As you can see, a new section called “Server Timing” has been added below, and in my case this returns a single value of 142.50ms, labelled “WordPress”.  This shows that approximately 71% of the TTFB was spent on the server.

In my next blog post, I’ll dive into more detail exactly how to implement this in PHP and WordPress.