5. Performance Tools
When you're building a modern web experience, it's important to measure, optimize, and monitor if you're to get fast and stay fast.
Sites should focus on optimizing for user-centric happiness metrics. Tools like Lighthouse highlight these metrics and help you take the right steps toward improving your performance.
The aim of this section is to consolidate this guidance for Agencies and Marketers to help them navigate performance tool offerings.
What are the different measurement tools?
Lighthouse [Lab data]
Lighthouse is an open-source, automated tool for improving the quality of web pages.
You can run it against any web page, public or requiring authentication. It has audits for performance, accessibility, progressive web apps, and more.
You give Lighthouse a URL to audit, it runs a series of audits against the page, and then it generates a report on how well the page did.
From there, use the failing audits as indicators on how to improve the page.
Each audit has a reference doc explaining why the audit is important, as well as how to fix it.
WebPageTest [Lab data]
WebPagetest is used for measuring and analyzing the performance of web pages.
It allows comparitive performance of one or more Mobile Site pages in a controlled lab environment, and deep dives into performance stats and test performance on a real device.
You can also run Lighthouse on WebPageTest.
There are a lot of options that may seem intimidating at first but doing quick testing is pretty simple.
Test My Site [Lab data]
Test My Site allows you to diagnose webpage performance across devices and provides a list of fixes for improving the experience from Webpagetest and PageSpeed Insights.
It is an excellent tool to kick start conversions around mobile site measurement and performance across devices.
The tool provides a list of specific fixes that can help identify areas to focus on and part of the output is a free detailed report with tips on what to do next and where to go for further resources.
Page Speed Insights
[Field data]
The Page Speed Insights tool shows speed field data for your site, alongside suggestions for common optimizations to improve it.
The tool helps in identifying performance best practices on any given website, provides suggestions on a webpage’s optimizations, and suggests overall ideas of how to make a website faster.
This tool can be accessed directly in any browser. Per URL request, it grades webpage performance on a scale from 1 to 100 and provides a report on suggested optimizations, divided into categories of high, medium, and low priorities.
Speed Scorecard
[Field data]
The Speed Scorecard is an easy-to-use tool that lets you compare your mobile site speed with industry peers.
Its data is based on how real-world Chrome users experience popular destinations on the web.
Compare Mobile Site speeds on the Speed Scorecard here.
Impact Calulator
[Field data]
Want to see how much you stand to gain by reducing page load time?
Using benchmarking data, we’ve examined the potential effect speed has on conversion rates. In retail, for example, we’ve seen that a one second delay in mobile can impact mobile conversions by up to 20%.
To use the Impact Calculator enter a few key data points , and get a directional look at conversions and revenue based on faster (or slower) mobile speeds.
Example use cases
So you're a Marketer or Agency..
You're trying to build a business case for improving user experience on a Mobile Website.
You speak pounds and pence and are looking for monetary figures that can help you quantify the opportunity cost and expected lift.
-
Use the Speed Scorecard to see how your mobile site speed compares against your peers in more than 10 countries. Scores are based on real-world data from Chrome User Experience Report.
-
Use the Impact Calculator to estimate the potential revenue opportunity of improving your mobile site speed. Impact is driven by benchmark data from Google Analytics.
-
Use TestMySite to test your page’s mobile loading time alongside industry benchmarks and to learn how simple fixes can speed up your site and decrease visitor loss; TestMySite is currently powered by WebPageTest and PageSpeed Insights.
So, you're a Developer
You're trying to understand and audit a website against modern web performance best practices.
Lighthouse contains a comprehensive set of performance opportunities; it provides you with a list of performance opportunities missing from your page and the time saved by implementing each optimization, which can help you understand what you should do.
So you're a Developer
You're a Developer trying to understand current performance of your site, as experienced by real-world Chrome users, and looking for audit recommendations against top industry trends and guidelines.
PageSpeed Insights helps you understand the real-world performance of your site, as experienced by Chrome users, and recommends optimization opportunities.
You seek technical guidance
You're a developer looking for further technical guidance. You want to know more about how to debug/deep dive into the performance of your site.
Chrome Developer Tools (CDT) contains a Performance Panel that allows you to drill down into performance issues with your site by profiling your site with customized configurations, allowing you to track down performance bottlenecks.
You can use CDT on either production or development versions of a website.
WebPageTest contains an advanced suite of metrics and trace viewers. It enables deep diving into the performance of your site on real mobile hardware with network conditions.