How to track the web performance of your Magento e-commerce? In the same way that improving the technical SEO structure of your e-commerce site contributes to increasing its visibility and traffic, optimizing loading speed is an essential lever for increasing conversions. Page loading time audit tools help measure and improve the webperf scores and metrics of a site using the Magento CMS . Among the online services that meet this need, Dareboost has the particularity of providing detailed reports on the performance of a web page.
The web application offers HAR reports to download including a lot of information such as the server response time (Time To First Byte) or the Speed Index, as well as a set of additional tips to apply to improve the Dareboost score. The goal? Optimize the user experience, SEO, reduce the bounce rates of your web pages and increase the retention of traffic visiting your e-commerce.
The Dareboost score to know the quality of the web pages of a Magento site
As part of a digital marketing and sales strategy, ensuring the quality of your online store’s performance is crucial. Google has set the tone: criteria such as responsive design, natural referencing (technical and semantic SEO), Core Web Vitals will weigh heavily in the visibility given to websites and e-commerce sites at the SERP level.
Dareboost is a service that allows you to audit web pages from a URL, to provide synthetic monitoring of websites and to track benchmarks. It exists in paid and free versions. The analysis of the performance of a web page begins by entering the URL of the page you wish to analyze. Before starting the audit, you must first choose a context:
- geolocation;
- browser type (Chrome, Firefox, etc.);
- the device type (desktop or mobile).
This context allows you to simulate the browsing conditions in which visitors access your Magento website. If you know the habits of your customers or your target market, it is relevant to choose your criteria according to the reality of your users, to get closer to the user experience (UX) on your e-commerce. Once the analysis is launched, it is possible to modify the context to be able to compare the performances according to the different situations.
Once the test is launched, Dareboost generates a summary of the results. The score that appears first is the Dareboost quality score . This is a metric that allows you to position yourself in relation to competitors. This indicator provides information on the validation of the control points defined by Dareboost, regarding the page whose URL was initially entered. To compare yourself to competitors , simply enter the addresses of their pages.
Waterfall analysis via Dareboost
In addition to the Dareboost score, other metrics are generated when creating the performance analysis report of your web page. The service purchased by the start-up ContentSquare offers an analytics feature, i.e. the ability to visualize the loading stages of the tested page in the form of a waterfall.
Dareboost also offers the following analyses:
- the number of requests between server and browser when loading the page,
- details of loading progress, weight and time required for each file type: HTML, JavaScripts, Images, CSS, etc.;
- access to the element loading timeline, or waterfall. This graphical representation of the loading of elements on a page includes the time it took for DNS resolution to be performed. It also observes the server response time (TTFB, Time To First Byte). Google recommends a TTFB of 200 ms. Details about the loading such as the headers of HTTP requests (GET, POST, etc.) are also included;
- The Performance Timings section details the steps of DOM loading, interactive DOM, and other JavaScript-related events;
- W3C CSS validation and errors in style sheets (CSS);
- warnings returned by the browser console.
This representation of the events occurring during the loading of your web page already allows you to understand if there are elements blocking or slowing down the display speed of your pages. For example, if the time taken by the resolution and the DNS lookup is high, this may mean that there are problems with the servers hosting your website or network issues (low download speed or other).
Speed Index and Performance Evaluation with Dareboost
In addition to the Largest Contentful Paint, Total Blocking Time and Cumulative Layout Shift, the weight of the tested page and the Time To First Byte, Dareboost displays the Speed Index.
The Speed Index is calculated by observing the loading of the elements of a page above the fold. These steps can be visualized and traced using a video recording of the loading of the web page. This video is then represented as a sequence of images: the filmstrip . Each frame of this sequence allows a progress ratio to be calculated by comparing it to the final rendering of the analyzed web page. By doing this, for each image of the filmstrip , it is then possible to represent the progression of the display as a function of time within a graph. The Speed Index is determined by calculating the area located above the plotted curve.
Regarding your website visitors, the Speed Index is one of the indicators directly linked to your users’ perception of speed, and therefore to their online experience. The higher the Speed Index, the slower the user sees the objects constituting the page appear. Also, two pages can have a Start Render (display of the first byte on the page) and a Visually Complete (full loading of the page) that are similar or even identical, but different Speed Indexes depending on the speed at which their graphic components appear in the viewport, in the eyes of the page visitor. An optimized page with a low Speed Index indicates that the page is displayed quickly for the user, but that does not mean that the entire page is loaded. However, their experience is then more satisfying: they will feel less impatient.
Google recommends a Speed Index value less than 1000.
Dareboost’s Tips for Improving Your Magento Site
The diagnostic and advice section lists recommendations generated by Dareboost to improve your website. In order to provide its improvement ideas, Dareboost also analyzes the ecosystem of your online business (Google Analytics and any other third-party web service that participates in its operation). The advice is divided into different categories and followed by explanations, in particular on the following points:
- query optimization;
- SEO and content quality (occurrences of keywords for example);
- data volume;
- accessibility;
- rendering optimization;
- cache policy;
- security (HTTPS, SSL certificate)…
Here are some examples of advice that Dareboost gives to its users:
- in the category dealing with data volume: “5 images are resized via a width/height attribute. An image retrieving a larger image than the one actually displayed unnecessarily loads too much data volume”;
- in the section about rendering optimization : “Defer the use of JavaScript code. When the web browser encounters JavaScript code while interpreting the source code of a web page, it can significantly slow down the display of the page, especially if it is necessary to download an external script.”
Once you have read these improvement ideas proposed by Dareboost, you can call on a developer or an agency specialized in the management of sites under Magento to implement them.
In conclusion, Dareboost allows a personalized quality analysis of your website as part of a technical SEO audit for example. However, being accompanied by an expert, a developer or an agency specialized in the Magento CMS makes the application of the advice easier. The goal is to improve your Dareboost score and make your online business more in line with user expectations. The web performance of an e-commerce site has a direct impact on SEO , your brand awareness and ultimately your turnover and sales.
We recommend these other pages:
