Improving Website User Experience with PageSpeed Insights

Bastty

Customer
As a website owner, you want to provide a great user experience to your visitors. One key factor in achieving this is page speed. A slow loading website can lead to frustration, high bounce rates, and lost revenue. That's where PageSpeed Insights (PSI) comes in. PSI is a tool from Google that provides insights into your website's performance and suggests ways to improve it.

PSI reports on the user experience of a page on both mobile and desktop devices and provides suggestions on how that page may be improved. It provides both lab and field data about a page. Lab data is useful for debugging issues, as it is collected in a controlled environment. However, it may not capture real-world bottlenecks. Field data is useful for capturing true, real-world user experience, but has a more limited set of metrics.

Real-user experience data in PSI is powered by the Chrome User Experience Report (CrUX) dataset. PSI reports real users' First Contentful Paint (FCP), First Input Delay (FID), Largest Contentful Paint (LCP), and Cumulative Layout Shift (CLS) experiences over the previous 28-day collection period. PSI also reports experiences for experimental metrics Interaction to Next Paint (INP) and Time to First Byte (TTFB).

PSI classifies the quality of user experiences into three buckets: Good, Needs Improvement, or Poor. PSI sets the following thresholds in alignment with the Web Vitals initiative:
Quality​
FCP​
FID​
LCP​
CLS​
Good​
[0, 1800ms]​
[0, 100ms]​
[0, 2500ms]​
[0, 0.1]​
Needs Improvement​
(1800ms, 3000ms]​
(100ms, 300ms]​
(2500ms, 4000ms]​
(0.1, 0.25]​
Poor​
over 3000ms​
over 300ms​
over 4000ms​
over 0.25​
PSI presents a distribution of these metrics so that developers can understand the range of experiences for that page or origin. This distribution is split into three categories: Good, Needs Improvement, and Poor, which are represented by green, amber, and red bars. Above the distribution bars, PSI reports the 75th percentile for all metrics. The 75th percentile is selected so that developers can understand the most frustrating user experiences on their site. These field metric values are classified as good/needs improvement/poor by applying the same thresholds shown above.

PSI uses Lighthouse to analyze the given URL in a simulated environment for the Performance, Accessibility, Best Practices, and SEO categories. At the top of the section are scores for each category, determined by running Lighthouse to collect and analyze diagnostic information about the page. A score of 90 or above is considered good. 50 to 89 is a score that needs improvement, and below 50 is considered poor.

Using PageSpeed Insights can be very helpful in identifying performance issues on your website. Here are some PROs:

PROs
  • Provides insights into real-world user experience data
  • Offers clear recommendations for improving website speed
  • Identifies key performance indicators critical to the user experience, such as First Contentful Paint, First Input Delay, Largest Contentful Paint, and Cumulative Layout Shift
  • Helps identify and prioritize fixes to improve overall website performance
  • Easy to use and free to access
 
Back
Top