Technical - Do you check your website’s performance regularly?
Updated by Tiago Araújo [SSW] 16 days ago. See history
Page speed remains a critical element for the online user experience. The demand for instant information has made faster loading times more crucial than ever.
Users are less patient, and if a webpage takes too long to load, they are likely to abandon it in frustration. This not only results in a lost visitor but also poses a risk to potential conversions.
Tip: Use this free Google tool named PageSpeed Insights to test your URL.
For a smooth and responsive user experience, your site needs to be checked for performance bottlenecks. These usually become noticeable sometime after deployment, as your user base and quantity of content grows.
This includes checking for improvements on:
- The slowest pages
- The compression of unnecessarily large images
- Slow database queries
- Page responsiveness
A website with large, uncompressed images, excessive plugins, and unoptimized code can lead to slow loading times.
Visitors may encounter delays, increasing the likelihood of frustration and abandonment.
This negatively impacts user experience and potential conversions.
❌ Figure: Bad example - Things that will negatively impact the website UX
On the contrary, a well-optimized website employs techniques such as image compression, efficient coding, and minimal use of plugins.
These optimizations contribute to:
- Faster page loading
- Enhancing user satisfaction
- Increasing the chances of retaining visitors and conversions
✅ Figure: Good example - Good performance will improve the website's UX
Use the Performance Tab in Chrome DevTools
One of the best ways to identify and fix performance issues is by using the Performance tab in Chrome DevTools.
This powerful tool helps you
- Record and analyze the page load process
- Identify long-running tasks that block the main thread
- Spot inefficient JavaScript execution
- Visualize layout shifts and rendering bottlenecks
How to use it
- Open your website in Google Chrome
- Right-click anywhere on the page and choose Inspect (or press F12)
- Navigate to the Performance tab
- Click Record, then reload the page to capture performance data
- After recording, you'll see metrics like Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), and other key performance indicators
::: bad img-large
Figure: Bad example - Slow LCP, leading to a poor user experience
:::
::: good img-large
Figure: Good example - Fast LCP shown in Chrome DevTools Performance tab
:::
Use Lighthouse for a Comprehensive Audit
Lighthouse is another powerful tool built into Chrome DevTools that provides a full performance audit of your website. It measures performance, accessibility, best practices, SEO, and more.
To run a Lighthouse report
- Open your site in Google Chrome
- Right-click anywhere on the page and choose Inspect (or press F12)
- Navigate to the Lighthouse tab
- Choose the report type (e.g., Mobile or Desktop)
- Click Analyze page load
This tool gives you a performance score and actionable recommendations to improve your site's speed and user experience.
::: good img-large
Figure: Good example - Lighthouse audit with high performance and SEO scores, plus actionable insights
:::