Improve webperf scores and metrics on a Magento site
Speeding up a Magento site is the cornerstone of a good user experience, and therefore of good engagement and good conversion rates. It is also one of the levers for improving SEO, and in fact, for increasing the visibility and sales of e-commerce. Indeed, a slow site makes visitors impatient and frustrates them, leaves them with a bad impression, and they then prefer to flee it in favor of more “reactive” competition. According to a Google study, 88% of users do not return to a site that has offered a bad experience.
This is why an online retailer has every interest in taking an interest in their web performance and the solutions to implement. To help you learn everything about accelerating a Magento site , we have selected the main tools available on the internet , in free or paid versions, designed to meet the challenges of online sales.
Whether it’s an audit of your site’s overall performance, a detailed analysis of each page and content element, or an assessment of your SEO compared to the competition, there are useful resources for all needs and all levels of expertise. In order to optimize your user experience, and therefore your conversions, but also your SEO, we will look at several tools on the internet that allow their analysis, such as Google Search Console, Lighthouse, Chrome UX report, PageSpeed Insights, WebPageTest, etc. Let’s take stock of a selection.
The importance of web performance for e-commerce
E-commerce is a particular category of website due to its resource requirements for managing its specific content: the large volume of product photos, the amount of data to manage, the functionalities and APIs for online sales (adding to cart, returns management, payment methods, internal search engine, etc.).
An e-commerce site is therefore, by nature, a site whose loading time is potentially longer than a blog with simply text and a few photos as illustrations. This is why its optimization is essential (compression of images and photos, minification of resources, concatenation of JavaScript and CSS sources, etc.). A fast site allows you to meet the requirements of Internet users in a hurry, because the majority of users do not wait more than 3 seconds for loading before closing the page. If Internet users leave your site without buying anything, this leads to a decrease in the conversion rate, the number of sales, and also a loss of qualified traffic that will probably not come back if they are disappointed with their online experience.
You are probably wondering what are the techniques to optimize the performance of a Magento site . This is a good start, but before looking for solutions to possible problems, we suggest you discover the measurement tools to collect the data essential to optimize the performance of your site.
There are many tools for measuring the web performance of a site. Be careful, however, the problem with using several solutions is that the results will vary since the context in which the data is collected is not the same. It is better to focus on a minimum of tools to monitor the evolution of your scores and your KPIs over time. It can also be difficult to know to what extent to trust the optimization recommendations proposed by these same tools, how to prioritize them, and what results to expect.
Evaluate your web performance with PageSpeed Insights and Lighthouse
Google, the leader among search engines, offers different tools that allow you to evaluate page speed and the quality of the user experience, including DevTools, Search Console, PageSpeed Insights and Lighthouse. E-commerce site publishers therefore have different sources of data to measure web performance, both in terms of loading speed and SEO aspects. Google collects synthetic data (by simulating navigations) and real data (thanks to its panel of real users CrUX), i.e. two sources of measurement for a high-performance site .
You should know that PageSpeed Insights relies on the Lighthouse score to evaluate the performance of sites, which is based on the following webperf metrics:
- First Contentful Paint (FCP), this measurement indicates the moment when the first pixel is displayed on the page, whether it is an image, text, etc.;
- Total Blocking Time (TBT), this data allows you to measure the total time during which the page does not respond to interactions, because it is performing long tasks;
- the Largest Contentful Paint (LCP), this information is useful to know the time needed to display the largest element on the page;
- Speed Index, this measure allows you to evaluate the speed with which the content above the fold of the web page is displayed;
- Time To Interactive (TTI), which indicates the moment from which a page becomes usable in a sustainable manner and without latency;
- the Cumulative Layout Shift (CLS), which evaluates the visual stability of elements on the page.
To help marketing teams or web developers get a good PageSpeed Insights and Lighthouse score with a Magento site, and understand the impact of each optimization, PageSpeed Insights and Lighthouse indicate, for example, the potential gain in loading time by applying the proposed recommendations. Be careful: these indications are often very optimistic compared to reality, and they should not be applied without the advice of an expert, because they must be intelligently articulated in relation to each other to avoid side effects.
Optimize the loading time of your pages with WebPageTest
We talked about PageSpeed Insights in the previous section, but in addition to this performance measurement tool offered by Google, there is another tool to analyze loading time and user experience in detail: WebPageTest. Due to the precision and variety of the data collected, this tool is particularly popular with webperf experts.
To get good results on WebPageTest with Magento , it is imperative to meet the requirements of several criteria in terms of speed, and therefore customer experience. In addition to webperf indicators (Start Render, Speed Index, Core Web Vitals, etc.), WebPageTest provides essential data on the performance of a site, for example:
- the total weight of the page (the lighter it is, the faster it will load in the browser);
- the number of requests between the server and the browser, for resources such as images, JavaScript, CSS…
WebPageTest offers functions for visualizing the loading of your pages in the form of a waterfall (graphic representation of the loading of the resources that make up the pages of your website), videos, and filmstrips. You can thus observe the complete and detailed progress of the loading of all the elements on your web pages. Thanks to the WebPageTest waterfall, you can quickly identify areas for improving the performance of your e-commerce thanks to the indicators present on the basic interface:
- the query list, listing all queries identified by the browser and their execution chronology;
- the timeline showing the time needed to complete each request (the faster the better);
- CPU usage, in order to visualize the consumption of system resources (the CPU curve must remain as low as possible);
- bandwidth, to identify when it is saturated during page loading;
- the periods during which the page is or is not interactive, that is, whether or not it can respond to user interactions.
Reduce Page Load Time and Measure Speed with GTmetrix
What slows down page loading? Images and scripts can be among the causes of a slowdown in a site. Images, when they are too numerous and too heavy, as can be the case for an e-commerce site because of the photos that illustrate the product catalog, and not optimized (without compression), are very heavy resources to load, thus slowing down the loading of a page.
Scripts, on the other hand, can also increase the loading time of the web page but also degrade interactivity. Once downloaded, the browser must execute them, thus delaying the loading of other content elements of the page, sometimes more important to the user than the script itself. This can be the case with JavaScript code , whose role can be to make a web page or a mobile web application dynamic and interactive, without these features being essential for the Internet user.
How to know which scripts are slowing down the loading of your pages? Like WebPageTest, GTmetrix is a detailed measurement tool for the performance and display speed of a web page. The platform precisely analyzes the loading speed of each element of a page in order to detect blocking sources. At the end of the analysis, GTmetrix assigns a score from 0 to 100 to each loading criterion analyzed.
How to get a good GTmetrix score with Magento ? In addition to detecting anomalies to correct, GTmetrix also recommends optimizations to implement to improve the site’s webperf metrics. This is a useful guide to understand how to optimize your loading speed on Magento.
Analyze the performance of your site and compare with the competition with Dareboost
Analyzing your site’s web performance is essential, and it’s a first step. But to know how much to optimize your performance, comparing yourself to the competition on the internet is essential. Indeed, positioning yourself in relation to your market is an important point of reference for understanding how much to improve your loading speed.
Knowing the scores of other players in the market allows you to know whether you are already among the good students, or on the contrary, at the back of the pack. If you define scores or performance thresholds to achieve, you will see if your objectives are realistic compared to sites that have technical constraints similar to yours.
Good news, there is a tool which, in addition to the various features offered in terms of analyzing the web performance of your site, allows you to analyze the performance of competitor sites, this is the Dareboost solution.
How to get a good Dareboost score with Magento ? First, to test your performance, simply enter the URLs of the competitor sites to be analyzed as well as that of your site, and the tool will return the data to you in the form of a comparison of the results and the technologies used to optimize web performance, without forgetting the details of the elements to be improved.
Optimizing the Core Web Vitals of your e-commerce
If you are interested in measuring your performance, you may have heard of Core Web Vitals. These are indicators used to measure the interactivity of the site, the display speed of a page and its visual stability. These metrics are used to optimize the user experience (UX) but also SEO:
- LCP, Largest Contentful Paint, evaluates the time it takes for the main element of the page to be displayed in the browser (the ideal duration should be less than 2.5 seconds);
- FID, First Input Delay, measures the time it takes for the browser to respond to a user’s first interaction (Google recommends not exceeding 100 milliseconds);
- CLS, Cumulative Layout Shift, evaluates unexpected layout changes characterizing the lack of stability of the page (a score lower than 0.1 is recommended by Google).
Google considering user experience, and therefore Core Web Vitals in its algorithm for indexing pages, asking how to have good Core Web Vitals with Magento is also an essential question!
We recommend these other pages:
