Top Free Website Speed Test Tools
The speed of a website is critical to its success. As discussed in our content delivery network guide, faster loading websites can benefit from higher SEO rankings, higher conversion rates, lower bounce rates, longer visitor duration on site, better overall user experience, and engagement. You can take advantage of the many free website speed test tools available out there to achieve optimal performance. Google's ranking algorithm wants your site to load in less than a second.
What can a website speed test help you analyze?
Here are just a few of the common ways websites speed test tools are used:
- Pinpointing which site assets are causing slow load times
- Verifying all scripts on your site are minified
- Determining whether certain images need to be compressed
- Detecting render-blocking JavaScript/CSS
- Testing time to first byte (TTFB)
- Analyzing total load times, page sizes, and request count
- Checking load speeds using servers in various countries
- Utilizing different browsers to ensure that load times and user experience is similar across all
- Analyzing HTTP headers
- Measuring performance of your CDN
- Verifying that your CDN is loading the correct assets quickly
Website speed concepts
Before running a website speed test it is important to understand a few concepts behind how these tools work so that you can better analyze the data and then optimize your site accordingly. You can both test the speed of your server and measure your CDN performance.
Time to first byte (TTFB)
Time to first byte (TTFB) is the measurement of the responsiveness of a web server. Basically it is the time it takes your browser to start receiving information after it has requested it from the server. By using a CDN you can dramatically reduce the impact of the load on your origin server, which in turn should help decrease your TTFB.
Read more about time to first byte and time to last byte.
Render-blocking
Render-blocking refers to JavaScript and CSS that are keeping your page from loading as quickly as it could.
JavaScript
Google recommends removing or deferring JavaScript that interferes with loading the above the fold content of your webpages. Here is a great tutorial on how to properly defer JavaScript loading.
In general, you should put your JavaScript in a separate file from the rest of your site. HTML5 gives you an easy way to "defer" JavaScript code. This means that it loads after the rest of your site loads. It makes it easier to test the true load speed of your page. For example, the following HTML5 markup can be used to load this after the page has loaded:
<script src="/js/run_later.js" defer></script>
However, sometimes for one reason or another, we need to place the script within our HTML file. Here is an example of deferring JavaScript by placing it just before your </body>
tag.
function downloadJSAtOnload() {
var element = document.createElement("script");
element.src = "defer.js";
document.body.appendChild(element);
}
if (window.addEventListener)
window.addEventListener("load", downloadJSAtOnload, false);
else if (window.attachEvent)
window.attachEvent("onload", downloadJSAtOnload);
else window.onload = downloadJSAtOnload;
CSS
You will then also want to optimize your CSS delivery to keep it from causing delays on page load. Here are a few ways to fix this:
- Properly call your CSS files
- Lessen the amount of CSS files
- Use less CSS overall
- Minify your CSS files
- Use SCSS to compile more efficient CSS
Here is a great article on render-blocking CSS by Ilya Grigorik, a web performance engineer at Google.
CSS is a render blocking resource, get it down to the client as soon and as quickly as possible to optimize the time to first render!
Minification of resources
Minification of resources means removing unnecessary characters from your HTML, JavaScript, and CSS that are not required to load, such as:
- White space characters
- New line characters
- Comments
- Block delimiters
This speeds up your load times as it reduces the amount of code that has to be requested from the server. You can use a tool like Dan's CSS and JavaScript Minify to remove all the unnecessary characters.
HTTP requests
When your browser fetches data from a server it does so using HTTP (Hypertext Transfer Protocol). It is a request/response between a client and a host. In general the more HTTP requests your web page responds to, the slower it will load.
There are many ways you can reduce the number of requests such as:
- Combining your CSS and JavaScript files
- Inline your JavaScript (only if it is very small)
- Using CSS Sprites
- Reducing assets such as third party plugins that make a large number of external requests
List of website speed test tools
Now that you have a basic understanding of the web performance concepts above, check out these free tools below for testing your website's speed. Each of them offers their own unique features, reporting, and different ways to dissect your results.
It is also important to realize when running tools like these that a first time DNS lookup will usually be slower. If you are comparing total load times it is sometimes better to run tests multiple times and take an average of the results.
1. KeyCDN Website Speed Test
KeyCDN built a fast and lightweight Website Speed Test tool that you can use to get detailed insights on how your website performs. It offers multiple locations to choose from around the globe, and you have the option of making your test results private or public. The test includes a waterfall breakdown and a visual website preview at the bottom. You can quickly see how many HTTP requests were made, the full size of the page requested, and the load time.
It is also one of the only tools besides PageSpeed that is responsive and works great on mobile devices.
2. Google PageSpeed Insights
Google PageSpeed Insights is a website speed test tool that grades your website on a scale of 1 - 100. The higher the number the better optimized your site is. Anything above an 85 indicates that your website is performing well. PageSpeed gives you reports for both the desktop and mobile versions of your site. You can view recommendations for improvements such as you need to minify CSS or optimize your images.
PageSpeed Insights measures how the page can improve its performance on:
- Time to above-the-fold load: Elapsed time from the moment a user requests a new page and to the moment the above-the-fold content is rendered by the browser.
- Time to full page load: Elapsed time from the moment a user requests a new page to the moment the page is fully rendered by the browser.
A mobile report includes an extra category called "User Experience" that is included in the scoring of your site. This includes checking your viewport configuration, size of your tap targets (buttons and links), and also eligible font sizes.
The PageSpeed Insights team also created a website speed test tool on think with Google which you might want to check out. One nice feature is the beautiful reports that it generates. Can be great for sending to clients.
3. Solarwinds Pingdom Speed Test
Pingdom is probably one of the more well-known website speed test tools. Their reports are divided into four different sections which include a waterfall breakdown, performance grade, page analysis, and history.
The page analysis offers a great overview with additional information such as a size analysis, size per domain (you can easily compare your CDN assets size vs your domain), the number of requests per domain, and what type of content had the most requests.
Pingdom's speed test tool also allows you to test your website's speed from more than 70 different locations.
The results of a Pingdom speed test provide you with performance insights, similar to Google PagesSpeed Insights, which outline where you can make improvements. The results also break down the page size by content type, page size by domain, requests by content type, and requests by domain.
4. GTmetrix
GTmetrix goes into great detail assigning your site a grade from F to A. It's reports are divided into five different sections including metrics pulled from Google's Lighthouse tool, waterfall breakdown, video, and history.
With a free registration, you can test from several different locations. They also let you choose between Chrome and Firefox. You can test and compare website performance against various connection types (like Cable vs dial-up) to see how it affects your page loads. Other advanced features include a video playback to analyze where your bottleneck is occurring and also the ability to run Adblock Plus. It is recommended to make a free account as you will get additional options, such as those mentioned above.
As of 2020, GTmetrix replaced its YSlow and PageSpeed metrics with tabulated data from Google's Lighthouse Tool. Lighthouse is generally considered the golden standard for modern web performance improvement. You'll need to make a Google account, but most of the features are free.
If you make a living off of running a site, you may want to dive into GTmetrix's premium features. Depending on the tier of account chosen, you can utilize their API, monitor a set number of URLs at set intervals, and have a certain amount of daily calls reserved for you.
5. WebPageTest
WebPageTest is very similar to some of the previous tools mentioned but has over 40 locations to choose from and over 25 browsers (including mobile). It assigns you a grade from F to A based on different performance tests such as FTTB, compression, caching, effective use of a CDN, etc. Its report is divided into six sections which include a summary, details, performance review, content breakdown, and screenshots.
It also offers a unique approach on the test. It runs what they call a first view and a repeat view. This helps to diagnose what may be a first time DNS lookup delay as mentioned earlier. WebPageTest has more advanced features as well such as video capture, disabling JavaScript, ignoring SSL certificates, and spoofing user agent strings.
6. Uptrends
Uptrends offers up to 226 locations to choose from when running your speed test. You can choose to test with a desktop or mobile device. You can even select screen size and whether to throttle the virtual connection speed. This used to be quite a basic site, but they've upped their offerings. Their report is broken up into two sections, a waterfall breakdown and domain groups. The domain groups offer a unique perspective as it categorizes the resources into different sources.
7. dotcom-monitor
dotcom-monitor offers 25 different locations and multiple options in which you can run your website speed test. Their unique feature is that you can run all geographical tests simultaneously. This can save you a lot of time, as every other tool you have to run them individually per location. You can then click into each individual report and or waterfall breakdown.
Their reports are divided into multiple sections, which includes a summary, performance, waterfall chart (breakdown), host, and errors.
8. Yellow Lab Tools
Yellow Lab Tools is a newer web performance and frontend quality testing tool developed by Gaël Métais. This tool gives you a lot of information and some unique features not seen in other tools such as a view of when JavaScript interactions with the DOM during the loading of the page and other code validation issues. Get a global score based on the following qualifiers.
- Page weight
- Requests
- DOM
- Bad JavaScript
- Bad CSS
- Server config
9. Google Chrome DevTools
And of course we can't forget Google Chrome DevTools. It is a very easy to use tool (with advanced features) and you can quickly launch it at any time in your Chrome browser using the following shortcut keys.
- Windows:
F12
or alsoCtrl + Shift + I
- Mac:
Cmd + Opt + I
The performance feature allows you to easily see what is costing you the most time and resources. The performance details can be broken down in many different ways, such as the time, activity, and source. In the "Performance" panel press Ctrl + E
(Cmd + E
) and then Ctrl + R
(Cmd + R
) to refresh the page. Record the amount of time that you want to be monitored. You can then click Stop
and evaluate the results.
We also have a great post on what is blocking the DOM and how to fix it. In the developer tools, you can see exactly the DOMContentLoaded time and the total load time. To run this click into the "Network" panel, click on the "Show Overview" option and press Ctrl + R
(Cmd + R
) to refresh the page. A blue line will show up for DOMContentLoaded and a red line for total load time. Normally everything that is left of or touching the blue line are assets that are blocking the DOM, or also referred to as render blocking resources.
Website speed test with Chrome extensions
There are quite a few free Chrome extensions in which you can analyze website speed. Here are a couple of them. You can easily launch them from right within your browser.
Mobile website speed test
If you are needing to run a mobile website speed test a couple of the tools we mentioned above do include this:
- WebPageTest
- GTmetrix
- dotcom-monitor
Another way to simulate a speed test on a mobile device is to use Chrome developer tools in device mode. To enter device mode click on the small phone icon in Chrome DevTools or you can press Ctrl + Shift + M
(Cmd + Shift + M
). You can then choose what device you want to emulate, the orientation, and even resolution. You can also change the network throttling to see how your website actually would render on say a regular 2G or 4G connection.
Summary
As you can see there are a number of website speed test tools you can choose from. Each of them has their own unique features as highlighted above. It is a good idea to regularly test your site and establish a benchmark so over time you can make improvements.
Once you know where the bottlenecks are you can begin to fix them. Almost all of the tools above list recommendations. Some of the most common fixes include:
- Compressing your images and files
- Picking a fast web host
- Optimizing your code and scripts
- Using a CDN
- Caching
- Reducing the number of HTTP requests