Website Analysis Tools Part 2: Performance Testing with WebPagetest
Last time, I wrote a bit about finding potential site improvements using a site auditing tool called Lighthouse. One area where Lighthouse was useful, but fell a bit short in my opinion, was in analyzing website performance - that is, the speed at which the site loads and can be interacted with. Today, I'm going to take a look at a more specialized tool that we use at Ashday to figure out the best ways to make our sites run lightning-fast.
I first found out about WebPagetest at David Porter's excellent DrupalCon Baltimore session "Web Performance in 2017". He had a lot of excellent points - and I'd recommend watching the session video for anyone interested in getting some technical details on web performance optimization - but learning about this tool was probably my most significant takeaway from the session.
All major web browsers include some form of waterfall view by default, but in my experience, they aren't as comprehensive or easy to use as this one.
The main use of the waterfall view and related tools provided by Webpagetest, is to determine what parts of the page are slower than others and to find ways to speed the website up. At a broad level, the closer the requests are to the left of the waterfall, the faster the page should load.
Fortunately, WebPagetest provides a number of other tools to help accomplish that goal. The Performance Review page checks for images that could be compressed and for requests where caching or a CDN (such as CloudFlare) might help speed the page up. The Content Breakdown page can be a good indicator for what the largest (and likely slowest) aspects of the page are; similarly, the Content Breakdown by Domain screen gives a good overview of where all the site's code is coming from, and may indicate what third-party services are having the most impact on site load time.
Another very useful feature is the ability to run two important types of tests: A "first view" test and a "repeat view" test. Many parts of a website are stored in a browser's cache after the site is first visited, which makes subsequent visits much faster. The "repeat view" shows what the waterfall looks like on such a visit. Optimizing the performance of the first view is important - since it impacts new visitors to the site - but optimizing the repeat view makes for a better user experience when they are navigating within the site. It's this sort of functionality which, in my opinion, puts WebPagetest head and shoulders above browsers' built-in tools for performance analysis.
What WebPagetest lacks in looks it more than makes up for in functionality. It is a vital tool for finding potential areas of improvement on a website; at Ashday, we've used it to determine our approach to optimizing numerous sites, each of which is now faster than they had been before.