One of the most important tools we use to help our clients is WebPageTest.org. There are several other options for page speed testing, but this is the one we will use for the duration of this page speed test series. We will cover the others in a post as well….but will focus primarily on this tool!
WHAT IS WEBPAGETEST?
Webpagetest is a fantastic free tool can help you identify why your website is slow and help you fine tune your website to be as fast as possible. It offers a variety of options to help you understand where you have bottlenecks in your speed and what visitors are experiencing on their first visit as well as repeat visits.
KEEPING THINGS SIMPLE
As you can imagine this is a topic that we can go on for hours about! We are ONLY giving you an overview of everything we think you should know and will focus deeper on ONLY the areas we think it is necessary. This is a very technical topic – but we promise to do our best to make it as easy to understand as possible.
WHY WE LIKE WEBPAGETEST
Webpagetest.org is our go to for speed test because of its flexibility and custom settings that allow you more accurate results. For this post we are primarily working with the default settings with just a couple of tweaks.
The other thing that sets it apart is that you can take multiple speed samples from your website – so for example if you take a 3 test run you will receive a 1st, 2nd and 3rd run. Then the results summary will provide an average of those 3 tests. In a perfect world your 3rd run should be faster than your third because some of your content will be cached on that 3rd test – if you find your 3rd is slower than your 1st you may have some other issues going on.
RUNNING A TEST
To run a test go to webpagetest.org and enter your details as outline below:
- Enter your website URL – make sure you enter your URL exactly how the default URL is. If you are https – then make sure you use that so you get the most accurate information. If you use www, then make sure you use that as well
- Test Location – choose the area that is closest to where your visitors may come from. We are in NJ so we typically use New York, NY. Dulles, VA is the default option so you can use that one – sometimes there are too many tests waiting for other areas – Dulles seems to be the fastest in most cases.
- Select A Browser – different test locations may have different browser options available – we typically stick with Chrome as our browser choice but IE is also a common option. Dulles, VA is their default test location and that has options for all the browsers Webpagetest works with so choose Dulles if you want all the options that are available.
- Advanced Settings – this is OPTIONAL, but we like to run 3 tests and then see the First View and Repeat View – you can uncheck capture video for now too just to speed things up a bit.
- Connection – this emulates the type of internet connection your visitor may have. You can play around with this option, but we typically keep it set to Cable since that is pretty standard.
- Keep Test Private – this just keeps it from showing on the webpagetest.org website as a “recently tested website” – we usually keep this checked.
- Click Start Test
You will see many other tabs and options – but we are not going to address those here since they are very technical. What we have outlined above is enough for a general overview of your website.
READING THE SPEED TEST RESULTS
THE A, B’s & C’s
Once the test is done you will be taken to a screen that has a variety of results for you to review. For this post we are only concentrating on the top area which shows letter grades and then a table with Performance Results.
Below is the top of the results page with the letters grades, let’s dig a little deeper to understand what this means.
The A, B and C’s – truth is, we do not even look at these, but if you are one who needs to have all A’s — then you can take a peak and then work on your page to improve it. Your goal is to make your website fast – not get pretty green A’s!
Here is what each of those alphabetic items mean:
First Byte Time – the time it takes for the server to respond to a user navigating the page, this is most commonly the backend time needed to build the page and often hosting plays a big part in this being too slow.
Keep Alive Enabled – in simple terms it is a communication that happens between the web server and browser that says “hey, you can grab more than one file at a time” – this allows multiple files to be retrieved at once otherwise one file would be downloaded at a time which would make it even longer.
Compress Transfer – basically this is a signal as to how big/small your file sizes are. If you have GZIP compression enables you should be good.
Compress Images – images are one of the biggest issues on most websites and by compressing them you are making the website smaller and removing image meta data which can greatly improve speed.
Effective Use of CDN – if your website is using a CDN (Content Distribution Network) it will be reflected here.
UNDERSTANDING THE PERFORMANCE RESULTS TABLE
Performance Results (Media Run)
This table gives you the AVERAGE load times of the 3 tests we ran and returns the averages for the First View and Repeat View.
First View is emulating a test of a person visiting your website with a browser that has its cache and cookies cleared out, it is basically a person visiting your website for the very first time.
Repeat View is done right after the first view and represents what someone would see and how fast it would load for someone who came to your site – left and came right back. The repeat view SHOULD be faster than the first!
Understanding the speed performance metrics above:
Load Time or Document Complete Time: First View: 3.468s / Repeat View 1.252s
The point at which enough is loaded to have some sort of interaction with the page – most images and code is loaded and users can scroll and interact with the page.
First Byte: First View: 1.250s / Repeat View .9777s
This is the time taken on the server side to display your web page. This has nothing to do with your files on your website – it is strictly a server related result. You would want this to be no more then 200-400s
Request: First View: 32 / Repeat View 2
This is the number of images, JS and CSS files and other elements that the server needs to pull in to display the website. While there is no right or wrong number – typically the lower the better.
You can see on the repeat view only 2 request were made – this is because of “caching” where most of the content is stored in the users browser.
Start Render:First View: 3.191s / Repeat View .874s
How long it takes for the browser to start to pull and display the content of the page or the point where a white page is not longer showing.
Fully Loaded: First View: 3.562s / Repeat View 1.252s
The full loading time of the page. This includes all tracking code, ads etc.
Speed Index: First View: 3381 / Repeat View 1122
How fast your site is – a lower score is better – this is not a metric we focus on too much but we have seen that a target goal is under 1000.
1) Run a WebPageTest.org test using the settings we noted above.
2) Analyze your information
3) If you dare – post your Best Load Time and Worst Load Time in the comments below! Specify if your website is a store, blog or other type of website so others can compare how they are doing.
4) Ask questions! We are here to help if we can!
NEXT POST: UNDERSTANDING THE WATERFALL