What is Dolpheen and how can it improve web performance?
Web performance, like security, is a constant concern for every website, and you don’t want to miss the target. This has been especially true since Google began promoting the fastest websites in its search results. At Cdiscount, we have a “performance coaching” team that assists all developers on these issues. In this article, you will discover how we came to create Dolpheen, our Real User Monitoring product for web performance, and why we have decided to market it using our baleen.cloud product.
From the haze of core web vitals to the creation of Dolpheen
In May 2020, Google announced that it would start including UX metrics in its search ranking algorithm by the following year. In so doing, the Palo Alto-based company is seeking to promote websites with a good user experience by pushing them to the top of search results. Based on core web vitals (LCP, FID and CLS) and new validation thresholds (FAST, AVERAGE and SLOW), Google has therefore laid the foundations for web performance standards.
The main difficulty was that Google provides access to the values of the three indicators on a daily basis only, and for the entire traffic on the website from the past 28 days. In short, we did not have any details or direct assistance in determining where and how to improve the values reported. The traffic for the entire website is consolidated in a general manner, without any possibility of isolating specific pages or slow configurations.
This led to several questions:
Which pages are the most damaged and frequently used? Do the core web vitals remain stable throughout the day? To what extent can we trust results from summarised historical tests based on robots rather than our entire group of users? Is it possible to quickly validate non-regression or performance improvement in production following a delivery? How should optimisations be prioritized? …
We realized that the existing tools did not provide all the information we needed to conduct this optimisation campaign. We therefore developed our own Real User Monitoring (RUM) tool with the aim of integrating the improvement of the overall user experience into all of our actions.
Dolpheen was born out of the need to collect accurate metrics (75th percentile value of core web vitals) based on real users and in real time, with as much information as possible on the hardware and type of connection. Our goal was to be able to identify all the optimisations needed to become FAST for all of Google’s web performance indicators.
Analyse all experiences, without compromise
Dolpheen is fast, and easy to deploy
Only two things are needed to implement the Dolpheen service:
- Tag configuration to indicate page types to send to server-side
Once this is completed, the service is operational, and the back-office dashboards are available for analysis.
The JS tag was developed using the web vitals community library and validated by Google consultants. After a few exchanges, the final bugs were fixed and the community was able to benefit from a stable version of the basic JS on Google’s lt GitHub.
Our main focus in the development of this JS was on optimisation: we can ensure an overhead of just 2ms for the user experience. This limited impact is made possible by the flexible and resilient event-driven architecture we have implemented. Dolpheen collects data without processing it immediately and does not waste time or browser resources. From the initial design phase, this asynchronous and scalable product was created to ensure resilience and continuity of service.
Dolpheen is fully hosted on the Azure cloud. Its components are based on modern and proven technology:
- Hosting: Kubernetees
- Services: Java 11 and Typescript
- Deployment strategy with HELM
- Kafka Event, Kafka Stream
- NoSql storage: CosmosDB
- Data analysis: Azure Machine Learning
Dolpheen enlights data analysis
We worked closely with Cdiscount’s front-end teams to ensure greater responsiveness and efficiency in identifying the changes that affected the site’s performance. We used a dogfooding approach, and each product development was tested by our internal customers.
We initially chose to provide a real-time view of the Google indicators to manage the optimisations on a daily basis or every few minutes in the case of releases and hotfixes.
This significant improvement made it possible to obtain an instant overview of the core web vitals on production as opposed to tracking the trends provided by PageSpeed Insights (a daily value representing a 28-day rolling average of aggregated metrics). Gone are the days of estimates using synthesis tools — we can now work with real users to validate the cost of a feature in terms of performance.
The developers also needed to target their optimisations. We therefore implemented the concept of dimension to segment the measurements (by page type, browser type, country, A/B tests, etc.).
Segmentation is central to the optimisation strategy. It allows us to precisely target the actions to be implemented. This allowed us to enhance the observability and establish cardinality rules for the dimensions in order to make the graphics as readable as possible.
In the example opposite, we see a server response time distribution curve (TTFB). We can clearly distinguish two overlapping profiles expressing two behaviours (cache hit is the first bump on the left with a high speed response time, and then cache miss with a long tail distribution).
From monitoring to diagnosis, our level of granularity allows us to analyse user sessions that are eligible for data collection.
Under these conditions, we obtain more information than that provided by metrics collection alone. For example, we are able to determine the CSS selector for the LCP element on the page. The precise nature of these details allows us to precisely target our optimisations.
Performance and conversion?
Based on learning models, Dolpheen uses the Azur Machine Learning platform to identify critical metrics or characteristics that contribute to user conversion.
Dolpheen and our advanced monitoring capacity has enabled the Cdiscount.com website to identify the path to the FAST category for all Google web performance indicators. We were able to put the right amount of energy where it really mattered, with a substantial save of time and money.
Now were are Google FAST, in addition to SEO improvements, we observed a rise in user satisfaction in terms of website navigation and even in terms of conversion. The gains have been significant and lasting. We have therefore decided to maintain the product team and begin marketing the product.