In my line of work I get calls frequently about Why is my site so slow to load? And many times blame gets passed incorrectly as to why something isn’t working. Sometimes it really is the host server that is slow either its busy from too many requests, under DDOS Mitigation, or its an older machine. This article will focus a bit more on client generated problems how to diagnose a slow website.

We’ll be using my site http://cgfxdesign.com as a guinea pig for my explanations.
Here is the working optimized statistics for this website

Optimized Site
Page Load Time:
1.30 seconds
Page Size and Request Count:  727.2KB / 50 Requests

So to run a check on site slowness duplicate the issue on another network this is vital as it could rule out your ISP as a cause. Use an external tool such as http://megaproxy.com or other proxy service to check this.

Next up run this tool on your website http://tools.pingdom.com and check the results here are the results for my website

Non-working site
Page Load Time: 39.20 seconds
Page Size and Request Count:  252.2KB / 55 Requests

The most obvious glaring issue here is my site is loading SLOWER with a smaller page size how could that be?

Take a look at the PAGE ANALYSIS for further info

The glaring issue here is in Server Response Code Client 4xx

The glaring issue here is in Server Response Code 4xx Client Error

I did not alter any code on this website, I simply broke the connection and made the images unavailable, the site is now spending A LOT of time trying to find those images to display them running up the clock here.

Client 4xx usually indicates a 404 Error, imagine the situation being your at a restaurant and you get a waiter that’s so new he hasn’t got a clue where to get the utensils that are missing, he spends a ton of time looking and never finds them but brings out your meal anyway.

Things to look for when you diagnose a slow website.

  • If you see a large page size (more than 1 MB), then your site requires the browser to download a lot of files before it can display your site’s content.
  • If you see a high number of Requests (more than 100), then your site requires the browser to make a lot of connections to display your site’s content. (Think ordering a entire pizza one slice at a time)
  • If you see any 4xx or 5xx errors on the Page Analysis tab, that means your site is referencing a URL that doesn’t exist (cannot be found), or otherwise is generating an error. You should investigate to see which URL is causing the error and fix it.
  • If you see any 3xx statuses on the Page Analysis tab, that means you’re referencing a URL that is causing a redirect (an additional request). You should investigate to see which URL is causing the redirect and fix it.
  • Under the Page Analysis tab, if you see a large amount of time spent on another domain under Time Spent per Domain, this means another site’s content could be slowing down your site. By connecting to that website and pulling content from there. You should investigate this further.

 

LORI is another excellent tool to use as its always on and doesn’t require a test to be run to get results.

To Use Firefox Plugin lori to Diagnose a slow website

  1. Go to Firefox Add-ons.
  2. In the “Search all add-ons” dialog box, type lori.
  3. Click Add to Firefox.
  4. Click Install Now, and then click Restart Now.

Things to look for: On the Add-on bar, you should see 3 sets of numbers.

  • The first set of numbers is the Time to First Byte. This indicates how quickly the first amount of data from your website is received by the browser. Scripts or plugins that fail to send data as soon as a request is made could cause site slowness.
  • The second set of numbers is the time it takes for the page to actually load all resources. The higher this number is the more latency your website is experiencing. This latency could also be because of your site’s program code or plugins.
  • The third set of numbers is the actual page size that is required to be loaded for your site to properly display. The higher this number is the more data must be downloaded for your browser to render the site. In general, you want to have most websites in the range of 300kb – 600kb. If your site is 1MB in size or larger you might experience latency as the server must ensure you’re loading all resources and content to render your site correctly.

Some Fixes

  1. Page Size — The bigger your page, the longer it takes to download, especially over slower connections.Big images are  the number one cause of slow loading pages. Most image creation software has image compression options. There are also online tools, such as Smushit by Yahoo®! that can help you compress large images. You should make sure that each image on your website is optimized for the Web. Also, resize images to fit the width and height you want them to display on your page. Often people upload giant 2000-plus pixels-wide images they snapped with their digital cameras and then use the width and height parameters to shrink them, like this <img width=”500″ height=”300″>. Don’t do that. If you say width=”500″ height=”300″ in your img tag, the image should actually be 500×300 pixels.
  2. Time to 1st Byte — An increased time to 1st byte means there are too many SQL queries or non optimized SQL queries. This can also include server-side calls to third-party API. If you’re running WordPress, get the WordPress Plugin P3 Profiler to discover what plugins are running what queries and how long each one takes.If you’re a WordPress user, there are a number of plugins you can check out. Caching plugins can be generally positive but also a negative depending on how much traffic and updates your sites get. Popular choices for WordPress are WP Super Cache, W3 Total Cache, Batcache and Tribe Object Cache. These plugins offer various page, database and browser cache features. Try each one out (one at a time, not all at once) and see what works best for you.
  3. Total Objects and Third-Party Objects — Too many objects on your page will require visitors’ browsers to perform the request and receive pattern too many times and slow down your page. Try combining JavaScript and CSS. Use sprites for your images.
  4. Cached Objects — You want browsers caching your site. You need to instruct the Web server to enable expires headers on your static objects. This tells browsers to cache the site.
  5. Text Compression — If you don’t have text compression turned on, your page is going to be slow. mod_deflate should help this check with your host to see if this is enabled or if you can enable it.

 

Leave a Reply