Thread by @mustafa01ali

We've just finished migrating the @Shopify mobile app to @reactnative 🎉. This is our biggest app and was built over a decade. Here's how it went 🧵

👩‍💻 We added 683k lines of code while deleting 2.5M lines. That's a net reduction of 1.8M lines. We migrated 586 screens to React Native and deleted 232 outdated screens.

📱86% of our code is now shared between iOS and Android compared to just 5% previously. Maintaining feature parity between platforms is now a non-issue.

🏎️ Performance was a big area of focus for us. We improved screen load times by 59%, app launches are now 44% faster, and webviews are now 63% faster.

https://x.com/mustafa01ali/status/1695098627683721341

🛠️ We've also improved stability of the app by eliminating ~500K crashes per app version to achieve >99.9% crash-free sessions.

🌟 Our users have noticed all these improvements. Our 28-day avg app store rating has increased from 4.4 to 4.8 on iOS and from 4.1 to 4.4 on Android.

📸 Apple and Google have noticed them as well. The app got featured 5 times while it was being migrated.

https://x.com/mustafa01ali/status/1801721357111279991

We ❤️ open source and wanted to give back to the community. We built and open sourced Flashlist ⚡️ which has become the defacto way of building high-performance lists in React Native

https://x.com/mustafa01ali/status/1542542577953644544

Our partnership with @wcandillon has resulted in the creation of React Native Skia. It brings the Skia Graphics Library to React Native, enabling high-quality 2D graphics and animations.

https://x.com/mustafa01ali/status/1767258980244697385

We are sponsoring @swmansion's work on Reanimated which enables high-quality animations with React Native

https://x.com/swmansion/status/1630590156255240193

We built and open sourced Tophat 🎩 to enable 1-click installation of mobile builds

https://x.com/mustafa01ali/status/1825920486666084360

📝 Things we learned:
1/3 Native code and native devs are crucial. There is no replacing the experience and taste that comes from having built high-quality mobile apps.

2/3 100% React Native should be an anti-goal. Use native wherever it is the best tool for the job (widgets, Siri shortcuts, watch app and complications, etc), or in places where there are high performance requirements.

3/3 Achieving good performance takes work and should be a priority from the start. Measure everything and relentlessly optimize every layer. Add automated monitoring to catch regressions.
shopify.engineering/improving-shop…

Overall, React Native has given Shopify a step change in productivity while allowing us to keep leveraging native wherever it makes sense. We're stoked about the future of React Native and will continue to work with Meta and the community to make it better.