React Native Upgrade: From Legacy Burden to Modern Asset

The Challenge

For many years the client had developed and maintained a custom enterprise mobile app used by thousands of sales staffers in-store. Over the years, however, incorporating security patches and adding new features was becoming increasingly difficult. The app ran on iOS and was based upon an old version of React Native (0.57.1). Performance and security issues were becoming increasingly evident, especially when the app was compared with similar but more modern apps. A further obstacle to a smooth upgrade was that the legacy technology had forced developers to build custom workarounds to avoid problems caused by legacy components.

To sum the situation up, the client needed help to:

• Update the app’s code base and dependent toolchain to an up-to-date version without unduly affecting business operations.
• Ensure that after replatforming, the app would continue to function with the maze of associated third-party SDKs and proprietary APIs.
• Extended the app’s compatibility to support newer OS versions and a broader range of devices on both Android and iOS platforms.
• Future-proof the application so that it could easily incorporate new features.

Our Solution

Instead of just jumping right in and performing the upgrade, our team crafted a detailed plan of attack with the goal of bringing React Native to the latest stable version, updating all third-party libraries and dependencies, while ensuring that app functionality remained intact.

The table below summarizes our eight-step approach:

Key points in our solution included:

• Architecture simplification: Our team removed custom hacks and redundant layers as well as using time-tested software design patterns to reduce future maintenance.
• Updated analytics: We added Firebase Analytics that gave the client real-time behavioural insights and usage statistics.
• Automated crash detection: We incorporated Firebase Bugsnag/Crashlytics monitoring, providing automated crash detection, allowing developers to catch and fix issues before they reach business users.

Business Impact

• Better user experience: In-store users report that the app is easier to use and loads faster. This helps improve staff productivity and makes the client’s stores a better place to work.
• Tighter security: The outdated tech stack prevented critical security patches from being installed. The new app not only incorporates all security fixes, but adds new layers of security helping the client stay ahead of attackers.
• Shorter release cycles: The updated application infrastructure allows app developers to release new features and app updates quicker. This leads to increased staff engagement and satisfaction.
• Lower TCO: By reducing the existing technical debt, the modern tech stack allows the client to waste less time developing elaborate workarounds and spend more time focusing on useful features.
• Wider platform support: We took advantage of React Native’s cross-platform abilities and provided the client the ability to run the app on Android devices in addition to iOS.