On may 5th, 2020 Google announced Web Vitals coined as “Essential metrics for a healthy site”. It’s evident that performance has a direct impact for businesses and this initiative from Google reinforces that. Being that our mission is to co-create high-quality software with our clients we definitely correlate performance with high-quality.
Why does it matter?
Performance is about human experience. It’s about how people experience the web. For the vast majority of people web is a key touchpoint their life. Performance can both positively or negatively impact how people feel. To illustrate why performance matters, I’ve pulled some data from the web to show both the positive and negative impact of performance.
higher conversion on sites that loaded in 2s or less
BBC lost 10% of users for every additional second of load time
of consumers expect a web page to load in 2 seconds or less
Pinterest’s increase in traffic and sign-ups when wait times reduced by 40%
User Centric Performance Metrics
Given performance is about people, we need a method to test performance based on peoples perception. The only way to truly know how your site performs for your users is to actually measure its performance as those users are loading and interacting with it. This type of measurment is known as RUM (Real User Management).
Noting that a single metric exists that can measure a sites performance based on a users perception there are several types of metrics:
- Perceived load speed – how quickly a page can load and render all of the visual elements to the screen.
- Load responsiveness – how quickly a page can load and execute any required code in order for it to respond quickly to a user
- Runtime responsiveness – once a page is loaded, how quickly can the page respond to user interaction.
- Visual stability – do elements on the page shift in ways that users don’t expect and potentially interfere with their interactions?
- Smoothness – do transitions and animations render at a consistent frame rate and flow fluidly from one state to the next?
Metrics To Measure
Based on Google’s announcement of Web Vitals the following metrics are a set that they deep as most necessary when measuring user centric performance. Google has mentioned that these metrics will evolve over time.
Definition & Target Speed
- Largest Contentful Paint (LCP): measures loading performance. To provide a good user experience, LCP should occur within 2.5 seconds of when the page first starts loading.
- First Input Delay (FID): measures interactivity. To provide a good user experience, pages should have a FID of less than 100 milliseconds.
- Cumulative Layout Shift (CLS): measures visual stability. To provide a good user experience, pages should maintain a CLS of less than 0.1.
Field & Lab Measurement Methods
There are many instances where measuring performance from an actual user is not possible such as when a site is in testing or before moving into production. Given this fact, two methods for measurement have been established:
- Lab – Before production, pre-release, local testing, etc
- Field – Real User Monitoring, based on how the actual user experiences the performance
Toold for Field Measurement:
- Page Speed Insights
- Chrome UX Report
- Search Console
- Firebase Performance Monitoring
Tools for Lab Measurement:
- Lighthouse
- Chrome Dev Tools
Simply Measure Your Sites Performance
The simplest way to get started in measuring your sites performance is to use the Chrome User Experience Report in Google Data Studio. This report indexes all websites across the web into a BigQuery database which is publicly available online.
Setting up your dashboard:
- Go to Chrome UX Dash – the connector for the Google Data Studio Dashboard.
- Input your sites domain in the origin URL field
- Click next
- Choose create report
Chrome UX Dashboard for WeAreNolte.com
Source: Think With Google, Google Developers:Why Performance Matters
