In brief
Leveraging tools like Lighthouse and Next.js functionalities, we significantly improved the app's performance, reducing loading times by at least 200%. The SEO improvements achieved exceeded the client's expectations, marking a successful collaboration that optimized the app for superior user and developer experiences.
Introduction
AutoZone is a major player in automotive retail with almost seven thousand stores worldwide. It’s a huge e-commerce company operating through a complex application on mobile and web.
In a span of several months, our team effectively overhauled the AutoZone app's performance, which initially struggled on both desktop and mobile devices.
Challenge
When AutoZone sought our expertise, the challenge was to address performance issues with their internal React Native apps, particularly the ones for delivery drivers and B2B auto parts ordering.
As we delved into the project, our focus shifted to the AutoZone web app, already in development for two years with unsatisfactory performance. Recognizing the client's goal to improve web performance and SEO rankings on Google, we geared our efforts to help them achieve the desired results.
Solutions
Working closely with the client's SEO team, we focused on Core Web Vitals metrics, including:
- Time To Interactive,
- Largest Contentful Paint,
- First Contentful Paint,
- Cumulative Layout Shift with Time To First Byte
Continuous monitoring with Lighthouse resulted in:
- 200% improvement in app performance,
- faster loading times,
- and a significant boost in SEO rankings.
Our efforts included optimizing a large shared JS bundle and leveraging tools like Bundle Analyzer and Source Map Explorer.
Results
We improved web app performance by 200% and increased SEO rankings. We achieved these results by taking the following steps:
- migrating from a custom server-side rendering (SSR) solution to Next.js,
- focusing on Core Web Vitals metrics,
- optimizing a large shared JS bundle,
- and introducing Fast Refresh for accelerated development iterations.
The introduction of Fast Refresh in Next.js further accelerated development iterations. All in all, it contributed to an enhanced user and developer experience.
The challenges we’ve solved so far
get in touch
Fill in the form and tell us a little bit about your enquiry. We’ll get back to you promptly to discuss your requirements.