Executive summary
Leading frontend engineering for critical checkout, payment and delivery journeys on a high-traffic US e-commerce platform.
Product & business context
Mattress Firm is a large US mattress retailer. The product supports discovery, delivery scheduling and checkout across the customer journey.
The business context combines complex payment options with commerce data from Microsoft Dynamics 365 Commerce through a GraphQL service layer.
My role
Principal Consultant (Frontend)
What I built
- Checkout and payment experiences across Adyen, Synchrony, Apple Pay and Affirm.
- Frontend data flows and API contracts across the GraphQL service layer.
- Delivery and order journeys with reusable, typed frontend patterns.
- Shared component architecture and frontend standards for a multi-team product.
Technical challenges
- Keeping payment, cart and order states consistent across provider integrations.
- Coordinating frontend behavior with Dynamics 365 Commerce and GraphQL services.
- Maintaining responsive, reliable critical journeys under high traffic.
Engineering decisions
- Use Next.js rendering strategies to balance freshness, performance and SEO.
- Keep payment provider orchestration separate from presentation components.
- Use typed data models and shared components to make cross-team delivery safer.
Performance & scalability
- Applied targeted rendering optimisations, code splitting and CDN caching.
- Verified impact: LCP improved by 40% and INP improved by 35%.
- Verified impact: reusable frontend patterns reduced feature delivery time by about 30%.
Results & impact
- LCP improved by 40% across key product and checkout pages.
- INP improved by 35% through rendering and interaction optimisations.
- Feature delivery time reduced by about 30% through scalable patterns.
Relevant screenshots
