Case Studies
Case Study: Argos
Background
In 2014, before the days of useful libraries like React, Argos's online website was heavily backend-driven, serving up pages via Java and JSPs. The core issue wasn't maintenance, which was relatively easy, but two significant challenges:
1. Legacy Code Bloat
- Argos had a core JavaScript library developed solely for their use, which over time was layered with lots of jQuery code. This was done to simplify work for the external team managing the project before it was handed over to my team.
- This layering caused severe issues, such as:
- Slow implementation of new features.
- An ever-growing list of defects with each new deployment.
2. Performance Issues
- Page load times were excessively long.
- Argos's analytics showed that these delays were causing significant customer loss.
Objectives
- Decouple the front end from the backend.
- Rewrite the JavaScript library, removing the jQuery that caused code pollution.
- Improve overall performance and reduce page load times.
Strategy and Execution
1. Decoupling Frontend and Backend
Implemented a separation between frontend and backend systems to streamline development and deployment processes.
2. JavaScript Library Rewrite
Rewrote the existing JavaScript library, often porting from the original library and removing jQuery. Reduced the codebase by 70%, significantly simplifying the code and making it more maintainable.
3. API Development
Created a new set of APIs to handle data exchange between the frontend and backend. Utilised Express for routing, which provided faster and more efficient data handling.
Performance Improvements
- Codebase Reduction: The JavaScript codebase was reduced by 70%, decreasing load times and simplifying maintenance.
- Routing Efficiency: Using Express for routing, performance improved by almost five times.
- Page Load Times: Significant reduction in page load times, leading to a better user experience.
Outcomes
- Enhanced Performance: Page load times were reduced by approximately 80%, improving user experience and reducing bounce rates.
- Improved Analytics: Customer retention increased as the site became more responsive and user-friendly. Significant reduction in the number of defects and bugs, resulting in fewer customer complaints and support tickets.
By addressing these challenges, my team and I not only modernised Argos's online presence but also ensured that it was scalable and maintainable for future developments. This project demonstrated the importance of clean, efficient code and the impact of performance on customer satisfaction and retention.