What is PageSpeed Insights?
PageSpeed Insights is a free tool from Google that measures the loading speed of a web page. It analyzes page content and generates detailed reports on the various aspects that can affect loading speed.
The tool’s operation is simple: simply enter the URL of the page you wish to analyze, and PageSpeed Insights will test it by simulating a connection on a mobile and desktop device. The tool then uses various metrics to evaluate the page’s performance.
Among the metrics measured by PageSpeed Insights are :
- Largest Contentful Paint (LCP): LCP measures the time required to display the largest visual element of the page on the screen. It is an important indicator of overall page loading speed. The shorter the LCP, the faster the page will be considered by the user.
- Interaction to Next Paint (INP): INP measures the time taken for the page to respond to a user interaction and display the result on the screen. It is an important indicator of the page’s responsiveness to user interaction. The shorter the INP, the more responsive the page will be considered by the user.
- Cumulative Layout Shift (CLS): CLS measures the visual stability of the page during loading. It takes into account unexpected shifts in page elements that may disrupt the user’s interaction with the page. A high CLS score indicates that the page has undergone many unexpected displacements during loading, which can adversely affect the user experience.
- First Contentful Paint (FCP): FCP measures the time taken to display the first visual element of the page on the screen. It is an important indicator of the loading speed perceived by the user. The shorter the FCP, the faster the page will be perceived by the user.
- First Input Delay (FID): FID measures the time it takes for the page to respond to the first user interaction. It is an important indicator of the page’s responsiveness to user interaction. The shorter the FID, the more responsive the page is considered to be by the user.
- Time to First Byte (TTFB): TTFB measures the time it takes for the server to respond to the user’s initial request and start sending the page data. It is an important indicator of server response speed. The shorter the TTFB, the faster the page will be considered by the user.
FID is similar to INP in that it measures page responsiveness to user interaction. However, FID only takes into account the first user interaction, whereas INP takes into account all user interactions during page loading.
It’s also important to note that INP replaces TTI in March 2024, as the page responsiveness metric in PageSpeed Insights reports. INP is considered a more accurate metric for measuring page responsiveness to user interactions, as it takes into account interactions that occur during page load, unlike TTI, which only measures the time it takes for the page to become interactive.
By using these metrics in addition to FCP, LCP, TTFB and CLS, PageSpeed Insights makes it possible to evaluate page performance from different angles and identify areas for improvement to deliver an optimal user experience. It’s important to note that these metrics are used in conjunction to evaluate overall page performance, and it’s recommended that all of them be taken into account to optimize page performance.
How do I use PageSpeed Insights?
PageSpeed Insights is a free, easy-to-use online tool. Here’s how to access and use the tool to analyze your website’s performance.
Accessing the tool
To access PageSpeed Insights, simply type “PageSpeed Insights” in the Google search bar, or go directly to the tool’s website at https://developers.google.com/speed/pagespeed/insights/
Analyze a web page with PageSpeed Insights
To analyze a web page with PageSpeed Insights, simply enter the URL of the page in the field provided and click on the “Analyze” button. The tool will then simulate a connection on a mobile and desktop device and generate a detailed report on the page’s performance.
It’s important to note that PageSpeed Insights uses the Lighthouse tool in the background to generate performance reports. Lighthouse is an open-source tool for measuring the performance, accessibility, best practices and SEO of a web page.
Interpreting analysis results
The results of PageSpeed Insights’ analysis are presented in the form of detailed reports, with scores for each metric measured and recommendations for improving page performance.
Reports include two types of data: laboratory data and field data. Laboratory data is collected in a controlled environment and measures page performance under ideal conditions. Field data, on the other hand, is collected from actual user data and reflects page performance under real-life conditions.
PageSpeed Insights field data is collected from the Chrome User Experience Report (CrUX), a public database of user experience data from real Chrome users. CrUX collects data on web page loading performance from millions of websites and makes it available in the form of public reports.
Variations on mobile and desktop
PageSpeed Insights reports also include performance variations on mobile and desktop. It’s important to note that mobile performance is generally more important to consider, as more and more users access the internet via their mobile device.
The PageSpeed Insights interface allows you to switch between mobile and desktop performance analysis. This is an important feature, as page performance can vary considerably between mobile devices and desktops.
To switch between mobile and desktop analysis in the PageSpeed Insights, simply click on the “Mobile” or “Desktop” tab at the top of the results page. You can then see the scores and recommendations specific to the selected device.
Page performance breakdown
In addition to scores and recommendations for each metric measured, PageSpeed Insights reports also include a detailed view of field data, allowing you to see the percentage of each performance category.
In the “Field Data” section of the report, you can expand the view to see the percentage of visitors who experienced “good”, “average” and “poor” performance for each metric measured. This detailed view enables you to better understand the distribution of your page’s performance and identify areas for improvement to deliver an optimal user experience.
For example, if the majority of visitors to your page experienced “poor” performance for Largest Contentful Paint (LCP), this indicates that the page is taking too long to display the largest visual element on the screen. You can then use the recommendations provided in the report to optimize LCP and improve page performance.
Laboratory data
The “Analysis of performance issues” part of the PageSpeed Insights report provides specific recommendations for improving page performance. These recommendations are based on the tool’s laboratory data, and help identify areas for improvement to deliver an optimal user experience.
The recommendations (Diagnosis) in the “Analysis of performance problems” section are listed in order of importance, with the most critical problems listed first. Each recommendation includes a detailed description of the problem, as well as instructions on how to solve it.
The “Diagnosis” section of the PageSpeed Insights report provides additional information on page performance, as well as details on the metrics measured in the “Lab Data” and “Field Data” sections. This part of the report is designed to help web developers understand the underlying causes of performance problems and identify optimization opportunities.
You can then unfold the view to learn more and correct the problem by unfolding the menus :
The “Diagnosis” part of the report comprises several sections, each focusing on a different aspect of page performance. Here’s a detailed description of some of the most important sections:
- Audits: This section provides a list of performance audits that have been carried out on the page. Each audit includes a detailed description of the problem, as well as instructions on how to solve it. Audits are listed in order of importance, with the most critical problems listed first.
- Opportunities: This section provides a list of optimization opportunities that can improve page performance. Each opportunity includes a detailed description of the problem, as well as instructions on how to solve it. Opportunities are listed in order of importance, with the most important opportunities listed first.
- Best practices: This section provides a list of performance best practices that have been applied to the page. Each best practice includes a detailed description of the practice and its impact on page performance.
- SEO: This section provides a list of recommendations for improving the page’s SEO. The recommendations are based on SEO best practices and include suggestions for improving page structure, content and meta tags. Each recommendation includes a detailed description of the problem, as well as instructions on how to resolve it.
- Accessibility: This section provides a list of recommendations for improving the page’s accessibility. The recommendations are based on web accessibility best practices and include suggestions for improving content legibility, navigation and page functionality. Each recommendation includes a detailed description of the problem, as well as instructions on how to resolve it.
- Metric details: This section provides detailed information on the metrics measured in the “Laboratory data” and “Field data” sections. Each metric includes a detailed description of the metric, as well as information on how it is measured and interpreted.
For example, if the report indicates that the page has a high loading time due to non-optimized resources, the recommendation may suggest compressing images or reducing the size of CSS and JavaScript files.
If the report indicates that the page has a high Cumulative Layout Shift (CLS), the recommendation may suggest defining dimensions for images and videos, or reducing the number of layout elements that move during page loading.
In short, to use PageSpeed Insights, simply enter the URL of the page you wish to analyze and click on the “Analyze” button. The tool will then generate detailed reports on the page’s performance, with scores for each metric measured and recommendations for improving performance. Reports include laboratory and field data, as well as mobile and desktop performance variations.
How can you improve your website’s performance with PageSpeed Insights?
Now that you know how to use PageSpeed Insights to measure your website’s performance, it’s time to take the next step: improving that performance. Here are a few tips to help you optimize your website using PageSpeed Insights recommendations.
Optimize images
Images are often responsible for a large proportion of a web page’s loading time. It’s therefore important to optimize them by reducing their size and using web-friendly formats such as WebP. You can use tools such as TinyPNG or CompressJPEG to reduce image size without losing quality. You can also use responsive images, which adapt to the size of the user’s screen, to improve performance on mobile devices.
Reduce server response times
Server response time is the time it takes for the server to process a request and return the requested data.
It’s important to reduce this time by optimizing your website code and using high-performance web hosting. You can use tools such as Google PageSpeed Insights or GTmetrix to identify performance issues related to server response time and get recommendations for resolving them.
Minimize CSS and JavaScript files
CSS and JavaScript files can slow down the loading of a web page if they are too large. It’s therefore advisable to minify them by removing white spaces, comments and unnecessary characters. You can use tools such as Minifier or UglifyJS to minify your CSS and JavaScript files.
Use a content delivery network (CDN)
A CDN is a network of servers distributed around the world that enables your website content to be delivered faster by bringing it geographically closer to users. By using a CDN, you can reduce the loading time of your website for users located far from your server. You can use services such as Cloudflare or Amazon CloudFront to set up a CDN for your website.
Activate compression
Compression reduces the size of files sent by the server, which in turn reduces page loading time.
We recommend that you activate Gzip or Brotli compression for all text files, including HTML, CSS and JavaScript. You can use tools such as Gzip or Brotli to enable compression on your website.
Cache resources
Caching allows certain resources of your website to be temporarily stored in a version that can be displayed more quickly, reducing the loading time of subsequent pages. We recommend caching static resources such as images, CSS and JavaScript files. You can use tools such as WP Super Cache or W3 Total Cache to set up caching on your website.
By following these tips and applying the PageSpeed Insights recommendations, you should be able to significantly improve your website’s performance and deliver an optimal user experience to your visitors.
Conclusion
Website loading speed performance is crucial to providing an optimal user experience and improving SEO. PageSpeed Insights is a free and easy-to-use tool offered by Google that enables you to measure the loading speed performance of a web page and generate detailed reports on the various aspects that can affect loading speed.
By using PageSpeed Insights and following the recommendations provided by the tool, you can improve your website’s performance and deliver an optimal user experience to your visitors. It’s important to note that performance optimization is an ongoing process, and it’s advisable to regularly measure your website’s performance to identify areas for improvement.
In short, PageSpeed Insights is an essential tool for any website owner wishing to offer an optimal user experience and improve their SEO. By using this tool and following the recommendations provided, you can improve your website’s performance and offer your visitors a smooth, fast navigation.