This content originally appeared on web.dev and was authored by Kayce Basques
Agrofy is an online marketplace for Latin America's agribusiness market. They match up buyers and sellers of farm machines, land, equipment, and financial services. In Q3 2020 a 4-person development team at Agrofy spent a month optimizing their website because they hypothesized that improved performance would lead to reduced bounce rates. They specifically focused on improving LCP, which is one of the Core Web Vitals. These performance optimizations led to a 70% improvement in LCP, which correlated to a 76% reduction in load abandonment (from 3.8% to 0.9%).
70%
Lower LCP
76%
Lower load abandonment
Problem
While studying their business metrics, a development team at Agrofy noticed that their bounce rates seemed higher than industry benchmarks. Technical debt was also increasing in the website codebase.
Solution
The Agrofy team pitched their executives and got buy-in to:
- Migrate from an older, deprecated framework to a newer, actively supported one.
- Optimize the load performance of the new codebase.
The migration took 2 months. Aside from the 4-person development team mentioned
earlier, this migration also involved product and UX specialists and a software
architect.
The optimization project took the 4-person development team 1 month. They
focused on LCP, CLS (another Core Web Vitals metric),
and FCP. Specific optimizations included:
- Lazy loading all non-visible elements with the Intersection Observer API.
- Delivering static resources faster with a content delivery network.
- Lazy loading images
with
loading="lazy". - Server-side rendering of critical rendering path content.
- Preloading and preconnecting critical resources to minimize handshake times.
- Using real user monitoring (RUM) tools to identify which product detail pages were experiencing lots of layout shifts and then make adjustments to the codebase's architecture.
Check out the Agrofy engineering blog post for more technical details.
After enabling the new codebase on 20% of traffic, they launched the new site to all visitors in early September 2020.
Results
The development team's optimizations led to measurable improvements in many different metrics:
- LCP improved 70%.
- CLS improved 72%.
- Blocking JS requests reduced 100% and blocking CSS requests 80%.
- Long tasks reduced 72%.
- First CPU Idle improved 25%.
Over the same time frame, real user monitoring data (also known as field data) showed that the load abandonment rate on product detail pages dropped 76%, from 3.8% to 0.9%:
This content originally appeared on web.dev and was authored by Kayce Basques
Kayce Basques | Sciencx (2021-03-01T00:00:00+00:00) Agrofy: A 70% improvement in LCP correlated to a 76% reduction in load abandonment. Retrieved from https://www.scien.cx/2021/03/01/agrofy-a-70-improvement-in-lcp-correlated-to-a-76-reduction-in-load-abandonment/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.