Wynshop

Offer customers the convenience of shopping on the go with a full-featured mobile extension of Wynshop Commerce – a unified experience for both the shopper and the grocery retailer.

Website

Retailers can deploy sophisticated digital storefronts, personalize their shopper's journey, monetize digital ad space, and optimize in-store picking and fulfillment with Wynshop. With the ability to easily integrate with other industry solutions, Wynshop’s modular, scalable, and intelligent technology makes it the preferred platform for leading grocers.

Engineering Highlights

  1. Android and iOS performance optimization
  2. Core feature development
  3. Cross team collaboration and team leadership
  4. Global deployments

Tech Stack:

• Expo • React Native • React • GraphQL • Apollo • Prisma • Postgres • Node • Express • TypeScript • Jest • Docker • GO • AWS • Material UI • Figma

Development

Mobile

Highlights:

  • Made to Order feature development
  • Staging and Production banner creation and documentation
  • Architecture optimizations, script optimization and global deployments

Wynshop Contributions

At Wynshop, I am part of the core team, specifically on the Golden Goose (GG) mobile team. Our team works globally with 20+ organizations and manages configurations for over 40 banners. (Banners represent different brands under the main retailer organization.)

When I joined, the GG mobile team consisted of 4 developers and faced significant pressure to re-establish the mobile application. During review sessions, we identified major UI/UX discrepancies and severe performance issues.

Key Achievements

Performance Improvements

We implemented several solutions to address performance bottlenecks:

  • Optimized API Response Handling:
    • Proper cache utilization for faster data retrieval.
  • Faster Local Storage:
    • Integrated MMKV for significantly improved storage speeds.
  • List Rendering Optimization:
    • Replaced FlatList with FlashList for enhanced rendering performance.
  • Streamlined Dependencies:
    • Conducted a thorough review of node_modules to eliminate unused or outdated modules.

Upgrades and Modernization

  • React Native Upgrade:
    • Migrated to a bridgeless architecture for better performance and maintainability.
  • State Management Enhancements:
    • Integrated Redux for efficient state management.
  • React Query Migration:
    • Migrated from version 3 to version 5 for improved data fetching and caching.
  • Animation Framework Updates:
    • Upgraded to the latest version of Reanimated.

Build Optimization

  • Faster Build Times:
    • Transitioned builds to Mac Mini, reducing build times by 33% (from 45 minutes to 15 minutes).
  • Optimized Build Scripts:
    • Streamlined scripts to further accelerate the build process.

Through these contributions, our team successfully stabilized and enhanced the mobile application, delivering a faster, more reliable, and user-friendly experience for global clients.