How to improve the load time of a website

To save test the load time of a website run speed test on – https://www.webpagetest.org/

This gives a pretty clear idea of where exactly the time is being spent when loading the webpage and what are the places of improvement.

fahimm.com WebPageTest Result

1. First Byte Time

Also called as Time to First Byte (TTFB) This is basically the time required for the server to send the first byte of the response.
This should be as low as possible. On webpagetest.org result if you click on TTFB it gives you current and Expected TTFB.

Solution – Use full page caching usually reduces the TTFB. Most of the managed WordPress hostings provide server level caching hence they usually don’t face this problem.

Recommendation –

  1. LiteSpeed Cache.
  2. WP Super Cache.
  3. WP Rocket.

2. Keep Alive

When downloading and rendering an HTML page a browser creates multiple HTTP requests to the server. Typically the HTTP connection between browser and server is closed with each request and opened again with the new request.
If KeepAlive is enabled then the HTTP connection between browser and server is kept alive to process multiple requests thus reducing a few milliseconds from the total load time.

More information – https://blog.stackpath.com/glossary/keep-alive/

Recommendation –

This is usually managed from serverside configurations and a user should contact their hosting provider in order to get this implemented.

3. Compress Transfer

This is similar to creating a ZIP archive of any file reduces its total size.
When transferring any JS/CSS/image files from server to browser. The server can compress it so that the content download size is lower and it takes less time to completely download the webpage.

There are multiple compression techniques available although most common is GZIP compression.

Recommendation –

Enabling GZIP Compression is done from server configuration and it depends on the server to server. It is recommended to contact your hosting provider in order to fix this.

4. Compress Images

This is a very easy win. Compressing image sizes quickly reduces the total webpage size and hence the load time.
There are many methods of image compression for eg Lossy, Lossless.

More information – https://wp-rocket.me/blog/image-optimization-easy-win-faster-site/

Recommendation –

WordPress plugins

  1. Shortpixel
  2. Imagify
  3. WP Smush

Online Services

  1. TinyPNG – https://tinypng.com/
  2. Kraken – https://kraken.io/

5. Use Progressive JPEGs

This is how baseline JPEG load VS Progressive JPEGs

Baseline JPEG
Progressive JPEG

As you can see progressive JPEGs appear to load quickly.

More Information –

  1. https://www.liquidweb.com/kb/what-is-a-progressive-jpeg/
  2. https://cloudinary.com/blog/progressive_jpegs_and_green_martians

6. Leverage browser caching of static assets

Static Assets are the CSS/JS/Image files. The static files usually don’t change in between pages hence these can be cached in the browsers of website visitors so  page loads are usually quicker.

“Cache Headers” need to be set in order to inform the browsers to store these files in their cache.

Recommendation –

Cache headers are set from server configuration and it is different from server to server. It is recommended to contact your hosting provider in order to fix this.


7. Reducing HTTP Requests

Reducing the number of HTTP requests are being made on the site can reduce the load time

Reduce HTTP request

Recommendation –

  1. Autooptimize
  2. WP Rocket

(Note – if a site is using HTTP2 then the number of requests does not actually affect the load time.)


8. Scan the waterfall to check the bottlenecks

You can scan the waterfall now and check if any URL is loading slowly and debug this manually

For eg. in this example this image taking more time to load.

Waterfall View
  1. Check if this can be optimized anyhow, In the above example, the image can be manually be compressed from different tools and re-uploaded.
  2. From where this URL is loaded. If it’s an image then probably from Slider, Page Builder, etc. Check if there are any settings to lazy load this.

Leave a Reply