The Business Challenge: Trapped on a Legacy Island
In late 2021, the B2B eCommerce division of Barcodes Inc. was operating on a custom-built, legacy eCommerce application built on the Kohana framework and was being held back by a significant and growing problem: technical debt. While the legacy site had served its purpose, the platform had long ago become a significant barrier to growth.
Years of accumulated code, inconsistent standards, and a lack of focused performance optimization had led to slow load times, poor Core Web Vitals, and a frustrating user experience. It was difficult to maintain, lacked modern features, was not scalable, and suffered from significant performance issues that created a poor user experience for its business customers.
The company needed to move to a modern, enterprise-grade platform to support its future growth, and they needed a leader who could architect and execute this complex digital transformation. This technical deficit was not just an IT issue; it was a direct impediment to business growth, impacting conversion rates, SEO, and the development team’s ability to innovate.
My Role: The Hands-On Technical Leader
I was brought in to lead the front-end of this transformation. My role was a hybrid of Lead Front-End Developer (80%) and Front-End Architect (20%). I was responsible for the full spectrum of the front-end, from high-level architecture to hands-on development.
Crucially, I also served as the liaison between the design, business, IT, and eCommerce departments. My role was to translate business requirements into technical solutions, ensure best practices were followed, and drive the project forward using an Agile methodology with tools like Jira and Git.
I was brought on to lead a tactical, hands-on rescue mission. My primary goal, as established in my 2022 performance plan, was to take ownership of the front-end codebase and drive a measurable improvement in front-end performance by 25%. My role was to diagnose the root causes of the performance issues post-migration, mentor the team on new best practices, and personally execute the high-impact changes needed to turn the situation around.
Process & Execution: A Two-Act Digital Transformation
The project was executed in two major acts: first, a foundational migration, and second, a targeted performance turnaround.
- Act I: The Migration to a Modern Foundation:
The first and most critical task was to migrate the entire B2B operation from the legacy Kohana application to Magento Open Source 2.4. This was not a simple lift-and-shift; it was a complete rebuild. I was responsible for building out all new, custom site components, including templates, layouts, and modules, using a modern toolset of HTML5, CSS3, JavaScript, Knockout.js, and PHP. - Act II: The Performance Turnaround:
After the new Magento site was successfully launched, the second phase of the mission began. A new platform does not guarantee high performance. I led a targeted initiative to meticulously optimize the new site. This involved a deep dive into the front-end architecture to improve Core Web Vitals and overall site speed.
The turnaround was executed through a disciplined, data-driven process:
- Audit and Prioritize: My first step was to conduct a comprehensive performance audit across the portfolio of sites. This established a clear, data-driven baseline for Core Web Vitals and allowed us to prioritize the pages and issues that were having the most significant negative impact on the user experience.
- Lead the Performance Initiative: I led a targeted initiative focused on systematically eliminating performance bottlenecks. This involved hands-on coding to optimize CSS and JavaScript delivery, improve image loading, reduce render-blocking resources, and enhance overall code quality.
- Establish New Standards: To combat the root cause of the problem and prevent future debt, I created and implemented a new set of front-end coding standards and best practices for the entire team to follow.
The Result: A 65% User Experience Improvement on a New Platform
This two-act approach delivered a complete digital transformation. The company was successfully moved off a high-risk, legacy platform and onto a modern, scalable, and feature-rich foundation.
Furthermore, the post-migration performance initiative yielded dramatic, measurable results for their B2B customers, as documented in my performance reviews:
- The percentage of users having a “Good” First Contentful Paint (FCP) experience increased by 65%.
- The percentage of users having a “Good” Largest Contentful Paint (LCP) experience increased by 26%.
This project demonstrates the full spectrum of a successful transformation: not only executing a complex migration but also ensuring the final product is meticulously optimized to deliver a superior user experience and drive business growth.
