How to find out and improve how fast a web page loads

Use Google Pagespeed Insights and Google Lighthouse to check how fast a page loads.

To run Google Pagespeed on your URL use the Google Pagespeed Insights and change the page to analyse accordingly.

To see Google Pagespeed in action use with the example.com. When run, a performance score and various analytics are returned for the example.com website. Note that example.com is a very simple website used for testing as because of its simplicity returns a very high score.

Google Pagespeed uses Google Lighthouse to generate reports. To run Google Lighthouse use the Lighthouse tab in Google Chrome.

To use with a batch of URLs use the NodeJS GoogleChrome/lighthouse module which includes a CLI (command line interface). The report returned from Google Pagespeed and Lighthouse include performance metrics and insights for best practices.

At the time of writing the report returns a total of 161 items that can be analysed.

Over time this post will be updated with items that should be monitored and can easily be changed. To get started we are going to look at performance opportunities properly sized images.

Properly sized images in performance opportunities - shows potential saving of time for images. The goal is to get this number as low as possible and in practice this means matching the image size used to the image size displayed. In a CMS (content management system) images are often uploaded by contributors. When uploading an image it is important to only upload images that have a width no larger than the required display size. For example, if the viewed image only needs to be 320px wide and the uploaded image has a width of 2,000px then it will take longer than necessary to load the page which is reflected in a properly sized images score with a high value. To read more visit web.dev properly sized images.

As mentioned this article will be updated to help with questions about improving page load times.

Feel very welcome to share a comment to help with learning more about how to find out and improve how fast a web page loads.