How to Reduce Initial Server Response Time in WordPress

I am sure you have run some kind of page speed test on your WordPress website if not I’ll tell you later in this article how you can do that. When you run PageSpeed insight on your website you have probably seen “Reduce Initial Server Response Time”. In this article, we are going to learn what is initial server response and how to reduce its time.

What does initial server response mean?

To understand the initial server response time first we need to understand the process of rendering the content on your browser. It is a four-step process that is mentioned below.

  1. Request: Request sends by the visitor’s web browser.
  2. Response: The request gets processed by the server and the necessary assets (web page files, resources, and such) sent back to the visitor’s web browser.
  3. Build: The visitor’s browser uses these assets to start rendering the requested web page.
  4. Render: After that, the web page is displayed to the visitor.

Initial server response time is also known as Time to First Byte (TTFB) means the time browser takes to receive the first byte of the request browser makes from the server. Meanwhile, TTFB consists of these three components:

1. The time is taken in sending the HTTP request

TTFB starts with an HTTP request. The time browser takes to send the request and the time server takes to receive the request. It depends on multiple factors such as DNS lookup time, the speed of the user’s internet, the distance to the server, and any interruptions in the connection.

2. The time is taken to process the request

Once the server receives the request from the visitor’s browser, it processes the request and generates a response. It involves starting the processes, making database calls, running scripts, and communicating with other network systems.

3. The time is taken by the server to send back the first byte of the response

Finally, the server needs to send the response to the visitor’s browser. The first byte of this response is the calculating factor.

As you can see this process depends on both the network speed of the user and the server. Since we can’t do anything about the user network speed we can improve our server speed.

What is a good server response time?

So what is a good server response time? According to Google recommended TTFB time is less than 200ms as shown in the table below.

0-200ms Google Recommended
200-600ms Passes Lighthouse
600-1000ms Fails Lighthouse
1000ms+ Very Slow

How does it affect your website?

Now let’s know how slow server response time affects our website and visitors? When your server response is slow your visitors see a blank page for few milliseconds and then content starts to load. Also, it is a deciding factor for ranking your website on google. Not just google most of the search engines rank your website based on initial server response time.

How to check your website’s TTFB?

Their many tools are available to check the TTFB of your website.

Lighthouse

initial server response time

Lighthouse is recommended and the most viable solution to check your website speed since index the site on Google is anyone’s first priority. To check the initial server response time in the lighthouse go to the link and type your website URL and click on analyze.

After a few seconds report of your website gets visible to you and if it is more than 200ms you will see the alert “Reduce initial server response time” or if it is less than 200ms in the passed audit section you will see the “Initial server response time was short“.

Always check this for both mobile and desktop and run this test multiple times to be sure.

Key CDN

Another very great tool is to check your TTFB is Key CDN. This tool lets you test your website on 14 different locations and you can get TTFB of your site for 14 different locations. If your website is targeted at global users you should check your site performance for multiple locations since location is also a factor of your TTFB and site speed.

Some other tools which you can use to test your site TTFB are mentioned below:

  • GT Metrix: In GT Metrix you can test your site performance, you don’t get the option to choose the location until you signup.
  • Pingdom: In Pingdom, you can choose between seven different locations to check your website performance.

How to reduce server response time in WordPress?

Now let’s know about how we can reduce our initial server response time.

1. Use a good hosting

One of the most important factors for faster server response is good hosting service, you should completely avoid using shared hosting and switch to managed hosting. Since managed WordPress hostings are specially tailored for hosting WordPress websites they are the best suitable option.

Your hosting should be scalable also since the number of traffic increases anytime and you should scale your site accordingly to avoid any delay in loading time.

You should also choose a server near your target user or most of the users are. For example, if most of your users are from Asia you should choose a server located in Asia, not in the US or Europe.

2. Use caching for your site

You should also use caching for your site, many hosting providers offer caching options and you should enable it for reducing initial server response time.

Not just hosting there are several different plugins available for WordPress which can cache your website for faster initial server response. Such as WP Rocket, Light Speed Cache, WP-Optimize, and so on.

3. Use CDN

A good CDN can also boost your website speed, CDN can transfer your website content very fast. CDN stands for Content Delivery Network and it is a geographically distributed network of proxy servers and their data centers. CDNs are used for high availability and faster accessibility to your server.

CDN lets your visitors access your website from farther away from your physical server at a very faster speed. The best part about CDNs is they are available for free. You can also use paid CDNs for better performance. Some good CDNs are StackPath, Cloudflare, KeyCDN, and Google Cloud CDN.

4. Avoid slow plugins and update regularly

A bad plugin can also slow down your website’s initial plugin, that’s why you should always update your plugins and avoid using unoptimized and old plugins. Query Monitor is a good plugin to monitor bad plugins. You can use the WP Hive chrome extension to monitor your plugin.

5. Optimize your database

Your WordPress database has many unnecessary data such as spam comments, post revisions, temporary files created by plugins, and others. This unnecessary data is also a reason for the slower websites. You can use plugins like WP-Optimize, WP Rocket, and Breeze.

6. Enable GZIP compression

Enabling a GZIP compression can also reduce the initial server response time for your website. Check out your hosting provider if they offer GZIP compression ask them to enable it and you can also use plugins for GZIP compression you can use a plugin called Enable Gzip Compression. WP Rocket also supports GZIP compression.

7. Use premium DNS

Typical cheap hostings don’t provide premium DNS, and normal DNS is usually slow you should consider using some premium DNS for faster initial server response time. You can also use DNS fetching for an even faster response. DNS fetching does DNS lookup in the background while the user is browsing.

8. Don’t combine CSS and JavaScript

Don’t get me wrong combining CSS and JavaScript can improve your website speed but it is recommended for small websites. If you have a very large and heavy website avoid combining them cause it can make a single file much bigger which takes extra download time. However, you should minify your CSS and JavaScript for faster performance.

9. Update to latest PHP version

The current latest version of PHP is 7.4 and you should use this version for the fastest performance. Many hosting providers offer old PHP versions and you need to ask them for the latest version. So always check and if your hosting provider has the latest PHP version.

10. Use .htacesss to reduce initial server response time

You can also use your website’s .htaccess file to improve your website’s performance. You can use several different methods using .htacesss to improve your website’s initial server response time.

You can use two main methods using .htacess to enable browser caching for your site, one is ExpireByTime and another is Cache-Control header.

ExpiresByType: To use browser caching using can simply useExpiresByTypefollowed by the resource type and the cache time period. The example code is given below:

### Optimize default expiration time - BEGIN
<span class="token directive-block tag"><span class="token punctuation"><</span>IfModule</span><span class="token directive-block-parameter attr-value"> mod_expires.c</span><span class="token punctuation">></span>
    # Enable expiration control
    ExpiresActive On

    # CSS and JS expiration: 1 week after request
    ExpiresByType text/css "now plus 1 week"
    ExpiresByType application/javascript "now plus 1 week"
    ExpiresByType application/x-javascript "now plus 1 week"

    # Image files expiration: 1 month after request
    ExpiresByType image/bmp "now plus 1 month"
    ExpiresByType image/gif "now plus 1 month"
    ExpiresByType image/jpeg "now plus 1 month"
    ExpiresByType image/jp2 "now plus 1 month"
    ExpiresByType image/pipeg "now plus 1 month"
    ExpiresByType image/png "now plus 1 month"
    ExpiresByType image/svg+xml "now plus 1 month"
    ExpiresByType image/tiff "now plus 1 month"
    ExpiresByType image/x-icon "now plus 1 month"
    ExpiresByType image/ico "now plus 1 month"
    ExpiresByType image/icon "now plus 1 month"
    ExpiresByType text/ico "now plus 1 month"
    ExpiresByType application/ico "now plus 1 month"
    ExpiresByType image/vnd.wap.wbmp "now plus 1 month"

    # Font files expiration: 1 week after request
    ExpiresByType application/x-font-ttf "now plus 1 week"
    ExpiresByType application/x-font-opentype "now plus 1 week"
    ExpiresByType application/x-font-woff "now plus 1 week"
    ExpiresByType font/woff2 "now plus 1 week"
    ExpiresByType image/svg+xml "now plus 1 week"

    # Audio files expiration: 1 month after request
    ExpiresByType audio/ogg "now plus 1 month"
    ExpiresByType application/ogg "now plus 1 month"
    ExpiresByType audio/basic "now plus 1 month"
    ExpiresByType audio/mid "now plus 1 month"
    ExpiresByType audio/midi "now plus 1 month"
    ExpiresByType audio/mpeg "now plus 1 month"
    ExpiresByType audio/mp3 "now plus 1 month"
    ExpiresByType audio/x-aiff "now plus 1 month"
    ExpiresByType audio/x-mpegurl "now plus 1 month"
    ExpiresByType audio/x-pn-realaudio "now plus 1 month"
    ExpiresByType audio/x-wav "now plus 1 month"

    # Movie files expiration: 1 month after request
    ExpiresByType application/x-shockwave-flash "now plus 1 month"
    ExpiresByType x-world/x-vrml "now plus 1 month"
    ExpiresByType video/x-msvideo "now plus 1 month"
    ExpiresByType video/mpeg "now plus 1 month"
    ExpiresByType video/mp4 "now plus 1 month"
    ExpiresByType video/quicktime "now plus 1 month"
    ExpiresByType video/x-la-asf "now plus 1 month"
    ExpiresByType video/x-ms-asf "now plus 1 month"
<span class="token directive-block tag"><span class="token punctuation"></</span>IfModule</span><span class="token punctuation">></span>
### Optimize default expiration time - END

You can change the time limit of the cache by using these codes  "now plus 1 day""now plus 1 week""now plus 1 month""now plus 1 year".

Cache-Control: Another awesome method is theHeaderdirective you can use this to declare a custom header for the resource. For this, you can modify your .htaccess file as shown below.

<span class="token comment">### 1 Month for most static resources</span> 
<span class="token directive-block tag"><span class="token punctuation"><</span>filesMatch<span class="token directive-block-parameter attr-value"> <span class="token string">".(css|jpg|jpeg|png|gif|js|ico)$"</span></span><span class="token punctuation">></span></span> 
<span class="token directive-inline property">     Header</span> set Cache-Control <span class="token string">"max-age=2592000, public"</span> 
<span class="token directive-block tag"><span class="token punctuation"></</span>filesMatch<span class="token punctuation">></span></span>

You can use Headermethods to writing less and clean code. Themax-age=2592000uses seconds to tell the browser how long you wanna keep the cache 2592000 is equivalent to a month you can put whatever second you want here.

Conclusion

Now you know what is initial server response time, how you can measure it, and how you can reduce it. If you face any issues while following this article let us know in the comment below. If you know some other methods for improving initial server response time do share them in the comments.

Have questions or confused about something WordPress Related? Join Our Discord Server & ask a Question

Leave a Comment

Your email address will not be published.

Scroll to Top