Performance Testing using Google PageSpeed Insights
We all want our websites to load quickly, and there are a number of services out there to help us test, evaluate, and fix various issues affecting the loading speed of our pages. In this series of docs, we will be looking at the major players in this area, Google PageSpeed Insights, GTMetrix, Pingdom and WebPageTest, and how they can help you improve the loading speed of your Avada website. Read on!
PageSpeed Insights is an online tool from Google, which helps in identifying performance best practices on any given website. The PageSpeed Insights API (PSI) reports on the performance of a page on both mobile and desktop devices, and provides suggestions on how that page may be improved, and suggests overall ideas of how to make a website faster.
Page Performance Summary
At the top of the report, PageSpeed Insights provides a score which summarizes the page’s performance. This score is determined by running Lighthouse to collect and analyze lab data about the page. A score of 90 or above is considered fast, and 50 to 90 is considered average. Below 50 is considered to be slow.
You will notice to the top left that the report defaults to the Mobile Results, in line with Google's Mobile First Indexing. See the Desktop results, as shown below, by clicking on the Desktop tab.
Below this Performance Summary are several sections, that first show the data captured, then a range of audits that show how to fix issues, how to generally improve the site, and finally a list of passed audits. Let's have a closer look.
PageSpeed Insights provides both lab and field data about a page. Lab data is useful for debugging performance issues, as it is collected in a controlled environment. However, it may not capture real-world bottlenecks. Field data, on the other hand, is useful for capturing true, real-world user experiences - but has a more limited set of metrics. See How To Think About Speed Tools for more information on the 2 types of data.
Field Data - This section shows a rolling 30 day report of the page using the Chrome User Experience Report. The field data is basically a historical report about how a particular URL has performed over time, and represents anonymized performance data from users in the real-world on a variety of devices and network conditions.
Classifying Fast, Average & Slow
PageSpeed Insights classifies field data into 3 buckets, describing experiences as fast, average, or slow. PSI sets the following thresholds for fast / average / slow, based on analysis of the CrUX dataset:
|FID||[0, 50ms]||(50ms, 250ms]||250ms and up|
|FCP||[0, 1000ms]||(1000ms, 2500ms]||2500ms and up|
FID & FCP
First Contentful Paint (FCP) marks the point, immediately after navigation, when the browser renders the first bit of content from the DOM. This is an important milestone for users because it provides feedback that the page is actually loading.
- Read more about FID and how it affects your page load.
- Use HTTP Caching to speed up repeat visits.
- Minify and compress text-based assets to speed up their download time. See Optimizing Encoding and Transfer Size of Text-Based Assets.
Origin Summary shows a developer the speed of all the pages that are served from this page compared to other pages in the Chrome User Experience Report over the last 30 days.
Unlike the Field Data, the lab data is based on a simulated load of a page on a single device and fixed set of network conditions. As a result, the values may differ. Labdata analyses a page using Lighthouse and then simulates how it will load on a mobile device. It then gives a performance score between 0-100 based on a set of performance metrics, including: First Contentful Paint, First Meaningful Paint, Speed Index, First CPU Idle, Time to Interactive, and Estimated Input Latency.
Lighthouse separates its audits into three sections:
The Opportunities section is what it says on the label. This section provides developers with recommendations to improve a page’s speed and gives an estimation of the page speed gained.
You can expand on the opportunities by clicking the small chevron on the right, and there is a link more more information about the particular issue.
Diagnostics supplies more information about the performance of a page as well as other recommendations to improve a page’s speed.
Likewise, the Diagnostics section can be expanded one point at a time, with further information and links to even more.
The final section, Passed Audits, is useful as it tells developers the audits that the page has passed on. These individual audits can also be expanded to show more details.
Google PageSpeed Insights is a valuable tool to help detect and remedy issues that may be affecting your websites' load time. It does however require time, patience and expertise. There are also other similar services like GTMetrix, Pingdom, and WebPagetest.
Remember, due to hosting and content variables, site optimization is a very complex area, and falls well outside of the support we can provide for Avada.
The Facebook Avada User's Group has a large and very active membership, and this topic is regularly discussed on the Group.