fast website

speed matters series

performance testing Part A

In this installment of our website speed matters series we will give you a beginners primer on how to analyze a websites performance using online tools to benchmark each major phase of loading.

Keep in mind that performance times will fluctuate with the server you are on and traffic load especially if you’re using a cheap shared website hosting service.

There are many components that load across the internet to the site visitors laptop/PC/phone/tablet/etc.  For the purposes of churning out a timely/helpful and “light” blog post I will focus on the ones our website designers consider the most likely to affect your websites load time.

  • JavaScript – While a lot of attention is spent on compressing images this is a big one and usually the biggest.  Many sites – including ours – have a lot of JavaScript to create fancy effects/advanced forms/etc.  Many programs such as WP-Rocket help defer JavaScript loading to reduce load time.
  • Images – Make sure any image you add to your website is compressed as much as possible (while keeping the image quality).  We use “Tiny Jpg.”
  • DNS Lookup – This is server dependent and your website hosting company will greatly influence this.
  • Server response time – once again if you have a cheap website hosting provider you may have issues here.

While there are many great tools for measuring website loading performance such as Pingdom we use GTMetrix 98% of the time so for the purposes of keeping this post short I’ll focus on that. 

Setup – Easy but here are a few tips:

  • Make sure you select the closest testing server to your main area – we use their Dallas server
  • Turn off “Stop Test On Load” which doesn’t tell you the fully loaded time.
  • Pay attention to the device detail when testing in the “using” section
  • Use an unthrottled connection in most cases

Performance Scores

  • Take the grades with a grain of salt.  For example you will get penalized if your images aren’t absolutely compressed as possible but in many cases you don’t want to overdo the compression because the image quality will suffer.  This will be covered in more advanced articles but your main focus is load time and “RUMS”

  • Fully loaded time should fall under 4.5 seconds and “RUMS” located in the TIMINGS tab should be under 1000.  The RUMS index is the perceived load time – as in when the site visitor visually sees everything critical loaded in the initial “above the fold”
    screen.
    Rums is actually the most important benchmark as if it appears to load fast to the site visitor (even though some components are actually still loading) then you are in good shape.
website loading time
website speed

There are a million utilities to speed up WordPress Mobile Sites and many of them suck.  I’m outlining what we use even though there maybe a divergent opinion out there:

  • WP ROCKET – The king of caching plugins, WP ROCKET caches your website pages and optimizes the size and delivery of html/css to give you impressive load times and is mobile friendly.  WP Rocket will also keep a separate cache for mobile which is great if you are using separate pages for mobile (vs the same page that is responsive)
  •  Asset Cleanup – WordPress has a lot of useless overhead such as RSS, oEmbeds, HTML comments, etc that are unneeded in most situations.  Asset Cleanup carefully removes these resulting in a leaner mobile website.
  • NGINX helper – this is advanced stuff but if you are running on NGINX based hosting and you have control of it then this is a great add-on to help keep your WordPress cache’s (such as wp rocket) in sync with your server NGINX FastCGI cache.
  • WP-Rocket NGINX – this is beyond the scope of this article but if your savy – real savy – check out GITHUB and download this.  It allows clients to bypass php and read directly into cached web page.

In our next Blog we will breakdown how to read a waterfall chart to see if there are any issues with individual load time on components such as JavaScript including render blocking which prevents your website from loading more components – making everything else wait until the render blocking component is loaded.

Scroll to Top