Did AI Kill React Native?

Did AI Kill React Native?

React Native: A Throwback Discussion

Introduction to React Native

  • The speaker reflects on the evolution of React Native, expressing nostalgia and a desire to revisit past discussions about it.
  • Emphasizes their role as a defender of React Native amidst changing perceptions over the years.

Airbnb's Impact on Perception

  • Discusses an influential video covering Airbnb's article on their decision to move away from React Native, highlighting how some arguments against it have aged poorly.
  • Mentions Shopify's successful adoption of React Native, showcasing its performance benefits compared to native versions, particularly in Android apps.

Shopify's Recent Decision

  • Reports that Shopify has announced plans to transition back to native code from React Native, sparking significant reactions within the community.
  • The speaker shares personal insights gained from recent experiences building with both React Native and native technologies.

Exploring Reasons Behind Shopify’s Move

  • Outlines the reasons for Shopify's shift back to native development, starting with their initial motivations for adopting React Native in 2020.
  • Highlights that while they saved time by using one codebase for multiple platforms, new developments in coding models have changed cost dynamics.

Reevaluation of Mobile Tech Stack

  • Discusses how improvements in coding models led Shopify to reassess their mobile technology stack and ultimately decide on a return to native development.
  • Notes that core assumptions behind their original decision have shifted due to advancements in technology and tools available today.

Performance Optimization Challenges

  • Addresses challenges faced while optimizing performance and maintaining foundational areas within React Native during its use at Shopify.
  • Reflecting on how machine learning models (LLMs), which were initially used for feature implementation and bug fixing, evolved into more complex roles over time.

Transitioning Back: Methodology and Tools

  • Describes how agents helped facilitate the transition by allowing developers to implement features across platforms effectively.
  • Acknowledges that despite returning to native development, there are still costs associated with maintaining software across two platforms.

Future of Open Source Libraries

  • Discusses Shopify’s commitment to contributing back to the open-source community as they transition away from certain libraries like React Native Skia.
  • Explains plans for archiving existing libraries while ensuring smooth transitions for users relying on them.

Migration Strategy Insights

  • Shares insights into migration strategies between gradually moving or rebuilding applications entirely; highlights preference towards greenfield approaches now due to improved tooling capabilities.

Addressing Over-the-Air Updates (OTAA)

  • Introduces OTAA as a critical factor influencing decisions around app updates and user experience management across different devices.

Conclusion: The Essence of React Native

  • Concludes with an analogy comparing the functionality of React Native with chefs managing recipes efficiently without compromising kitchen operations.

Understanding React Native as a Recipe Distribution System

The Functionality of React Native

  • React Native operates as a recipe distribution system, allowing developers to provide new functionalities without altering the native components.
  • Both Apple and Google discourage using this method for shipping new features due to their review processes, but it is effective for quick fixes or temporary changes.
  • Traditional native development requires extensive planning and hardcoding for time-sensitive features, which can lead to complications if not executed correctly.

Over-the-Air Updates

  • With React Native, developers can implement over-the-air updates (OTAA), enabling them to push changes quickly without going through lengthy review cycles.
  • The increase in app updates has likely eased the burden on Apple's review process since minor changes do not require full app reviews.

The Role of Expo in Enhancing Development Experience

Benefits of Using Expo

  • Expo provides essential tooling that enhances the developer experience with React Native by managing builds and OTAAs efficiently.
  • Developers face challenges with Apple's permissions and signing processes when building apps natively, making Expo's streamlined approach more appealing.

Simplifying Development Loops

  • With Expo, developers can easily test applications by scanning QR codes, significantly improving the development loop compared to traditional methods.

Challenges Faced in Mobile Development

Comparison with Other Platforms

  • Despite its advantages, mobile development remains cumbersome; issues persist across both Apple and Google platforms.

Library Management Issues

  • A significant challenge in React Native is library bloat due to difficulties managing packages within Xcode, leading to frustration among developers.

App Size Considerations

Misconceptions about App Size

  • Critics often claim that React Native apps are bloated; however, real-world examples show minimal size differences between native and React Native applications.

Factors Influencing App Size

  • Localization and media assets contribute more significantly to app size than the underlying framework itself.

Foot Guns in React Native Development

Risks Associated with Accessibility

  • The accessibility of React Native attracts less experienced developers who may inadvertently introduce critical errors into mobile applications.

Average Developer Skill Levels

  • There is a notable disparity in skill levels between average React Native developers versus native developers due to varying complexities of each technology stack.

Navigating Changes in Architecture

Impact of Architectural Changes

  • Significant rearchitectures within React Native complicate version upgrades and integration with existing codebases.

Upgrade Challenges

  • Upgrading versions often requires deleting package files and reinstalling dependencies due to compatibility issues encountered during upgrades.

Dependency on Meta's Support

Limitations Imposed by Meta

  • Developers must wait for Meta’s support before utilizing new features from Apple or Google instead of being able to implement them directly when developing natively.

Performance Considerations

Background Data Handling

  • Maintaining background data connections poses challenges within a JavaScript environment when an app goes into sleep mode on iOS devices.

Shopify's Migration Experience

New Architecture Introduction

  • Shopify's exploration into native coincided with major improvements introduced by a new architecture aimed at enhancing performance between JavaScript and native layers.

Decision-Making Process at Shopify

  • Decisions regarding technology shifts at Shopify are often made abruptly by CEO Toby without team input, impacting project direction significantly.

The Debate on Android Navigation

Gesture vs. Menu Bar

  • The speaker criticizes Android users who prefer the old menu bar, arguing that they waste screen space due to fear of change and should embrace gesture navigation instead.
  • A heated discussion arises regarding swipe gestures; while some team members swipe from the left, others start from the middle, leading to confusion and frustration over app functionality.

Bug Discovery in Navigation

  • A bug is identified where a drawer interferes with the back swipe gesture, causing issues for users who swipe from the middle of the screen.
  • The speaker reflects on their experience at Defcon, observing an Android user struggle with navigation due to this bug, reinforcing their belief about gesture usage.

Swift UI Navigation Limitations

Native Navigation Constraints

  • Swift UI's native navigation stack only allows swiping from the left edge for back gestures and does not permit customization of touch areas.
  • Users can successfully swipe back from both edges and middle in iOS settings, indicating that built-in apps do not rely solely on native navigation stacks.

User Experience Challenges

  • Inconsistent back navigation experiences across different apps lead to user frustration; if one app behaves differently than another, users may blame it rather than recognizing platform limitations.
  • The speaker expresses dissatisfaction with Apple's developer experience compared to those fixing issues themselves within React Native.

Transitioning Perspectives on React Native

AI Influence on Development

  • Pre-AI opinions are deemed less relevant as AI becomes more integrated into development processes; however, certain aspects remain crucial.
  • Key elements like effective databases and type safety are emphasized as essential for reducing bugs and improving application performance.

Adoption of New Tools

  • The speaker discusses their shift towards using Convex for project management due to its efficiency in defining systems through code.

Porting Applications Effectively

Agent Performance in Code Porting

  • Unlike Shopify's experience, giving agents clear instructions leads to successful porting of applications between platforms without significant errors.

Personal Experience with Porting

  • The speaker shares their success in creating a Swift UI version of a previously developed React Native app using AI tools effectively.

Performance Insights in React Native

Contributions by Jay

  • Jay’s libraries focus on performance improvements within React Native applications; his work has also been adapted for web use successfully.

Benchmark Comparisons

  • Jay argues that React Native can outperform native solutions based on solid benchmarks and performance metrics established through extensive testing.

Team Dynamics at Meta

Engineer Distribution

  • At its peak, Meta had significantly more engineers dedicated to React Native compared to core React development—over 300 versus under 30.

Complexity of Development

  • Building React Native is inherently more complex than core React due to its need for comprehensive access across multiple platforms (iOS/Android).

Changes Within Meta's Teams

Talent Migration

  • Many talented engineers have left Meta’s teams due to reduced investment in projects like React and React Native, impacting overall quality.

Future Outlook

  • While there will always be reliance on existing frameworks like React Native, ongoing maintenance may decline without dedicated human resources.

Turn any video into a summary like this

YouTube links, meetings, lectures — with transcripts, search, and chat.

Video description

Shopify is making the move away from React Native and it's kinda a big deal, especially since I spent so many years covering React. Thank you to Greptile & Convex for Sponsoring: Greptile: https://soydev.link/greptile Convex: https://soydev.link/convex Sources: https://shopify.engineering/back-to-native https://x.com/jamonholmgren/status/2098246307370692847 https://x.com/ErfanEbrahimnia/status/2098145097334379001 https://x.com/tobi/status/2098406220402946246 https://www.reddit.com/r/reactnative/comments/1wd8b4d/whats_your_opinion_on_this https://x.com/jmeistrich/status/2098157892838867365 Want to sponsor a video? Learn more here: https://soydev.link/sponsor-me Check out my Twitch, Twitter, Discord more at https://t3.gg S/O @Ph4seon3 for the awesome edit 🙏