Intro

In the realm of mobile app development, React Native Expo has garnered a lot of attention. With its promise of rapid growth, seamless cross-platform compatibility, and a vibrant community, React Native Expo has been a go-to choice for developers worldwide. However, like any technology, it has faced challenges and criticisms. But with the dawn of 2024, it’s time to reassess and give React Native Expo one more try.

Old issues

In the earlier versions of React Native Expo, developers faced several challenges and limitations that impacted their development experience. Here are some of the key issues that developers encountered:

1. Limited Access to Native Modules. One of the primary concerns with older versions of Expo was the limited access to native modules and device features. While Expo provided a wide range of pre-built components and APIs through the Expo SDK, developers often needed additional functionality that required native code. Without the ability to easily integrate custom native modules, developers were sometimes forced to eject from Expo and switch to pure React Native development. By ejecting from Expo, developers regained full control over the native code of their apps and could integrate custom native modules as needed. However, this decision brought trade-offs, including increased complexity, a steeper learning curve, and the loss of the Expo’s convenience features. In my experience, all Expo projects ended up being ejected.
   
   
2. Performance/Size Bottlenecks. Expo provides a convenient way to build and manage React Native applications by abstracting away some of the complexities of the native development process. However, this abstraction has certain trade-offs, including potentially larger bundle sizes than React Native CLI apps. Performance issues could lead to sluggish user interfaces, longer load times, and reduced overall app responsiveness.
   
   
3. Less Control Over the Build Process. While Expo provided a rich set of pre-built components and APIs through the Expo SDK, developers could not modify or access the underlying native code directly. This limitation made it challenging to integrate custom native modules or make low-level optimizations that required changes to the native code. Developers had less control over the specific versions of dependencies used in their projects. In some cases, this lack of control could lead to issues with incompatible or outdated dependencies.
   
   

Understandably, the limitations of older Expo versions may have led developers to stop using Expo a few years ago. While offering convenience and ease of use for many developers, the Expo wasn’t always suitable for projects requiring more fine-grained control over the development and build process.

Since then, it’s worth noting that Expo has continued to evolve and improve. The Expo team has addressed many of the concerns raised by developers, introducing new features, optimizations, and flexibility in subsequent versions. Expo has evolved into a comprehensive platform for building, deploying, and managing cross-platform applications.

Spoiler: All of the development issues that Expo had are fixed or improved.

What is the Expo nowadays?

Managed Workflow and Bare Workflow

Managed Workflow. In the managed workflow, you can build, test, and deploy your apps using Expo’s infrastructure without the need to manage native code or build configurations. Expo handles over-the-air updates, push notifications, and asset optimization, allowing developers to focus on building their apps.

Bare Workflow. Expo offers the bare workflow for projects requiring more customization and access to native code. In the bare workflow, developers have full control over their apps' native code and can integrate custom native modules, platform-specific features, and third-party libraries as needed. This approach provides flexibility and control while still leveraging Expo's development tools and services. You can use the Expo SDK and EAS with the existing React Native app.

If you have direct access to the native code, it’s a bare project. In other words, if you have folders android and/or ios, you use a bare workflow.

Managed Workflow is a core feature of the platform, providing developers with a simplified development experience. The Expo team worked hard to make it suitable for as many projects as possible.

Easy(ish) Setup

Setting up an Expo project is relatively straightforward, thanks to the Expo CLI tool, which streamlines the process.

You need to have installed Node and Watchman tools on your machine and run the single command npx create-expo-app.

And that’s it. You are ready to use your application. Just navigate to the directory and run one of the following commands:

To open a project on Android or iOS devices, you must download an app called Expo Go from the store.

Expo Application Services (EAS)

Expo EAS is my favorite update because it provides numerous useful features and enhancements for mobile app development. The code can be built, signed, and deployed in the cloud. Its power and convenience make the development process much more efficient, enjoyable, and faster.

Here are some key components and features of EAS:

1. Build Service: EAS provides a cloud-based build service that automates building native app binaries for iOS and Android. You can use EAS Build to build your apps in the cloud without setting up and maintaining your own build infrastructure. EAS Build supports both managed and bare workflows, allowing to build and customize apps according to their specific requirements.

2. You don’t need a Mac to build the iOS app. Expo uses M1 workers by default for iOS builds, which improves build time almost twofold. Large iOS builds run on M2, which speeds up the build process even more.

3. Submit Service: EAS provides a submit service that simplifies the process of submitting apps to the Apple App Store and Google Play Store. You can use EAS Submit to automate the app submission process, which includes code signing, app store provisioning, and metadata management. You can submit an app using a single command from your terminal or CI.

4. OTA Updates: EAS allows developers to deploy over-the-air app updates without submitting a new version to the app store. EAS Updates streamline the deployment process and ensure users receive the latest features and bug fixes quickly and efficiently.

5. Internal Distribution: EAS Build provides shareable URLs for builds for internal distribution without going through an app store by using ad hoc provisioning on iOS and standard APK side-loading on Android.

When you want to include libraries that contain native code in Expo projects, you can leverage EAS Build while still benefiting from Expo’s streamlined development experience. Moreover, you don’t need to play with Pods and other native library configurations. Everything is handled by EAS Build. So you don’t need to eject the app anymore. BTW the Expo team renamed this process. The command expo eject no longer exists; it was replaced by expo prebuild.

You won’t need EAS to use Expo, which will always be open-source and free. You can choose a different CI/CD service. Moreover, as I mentioned, you can use EAS with any React Native project, whether or not it uses Expo’s open-source tools.

If you prefer to build the app locally, it’s also possible. Just pass a special flag to the build command eas build — local.

You can always use this amazing service for free for individual or hobby projects. More pricing information is here.

Development Builds

Creating a custom development client for your application allows you to extend and customize your Expo project beyond what is provided by the standard Expo Go runtime. In other words, it’s your version of “Expo Go”.

Development builds allow you to install native dependencies and continue using Expo without ejecting. This is particularly useful when you need to test and iterate on features that require custom native modules or configurations not supported by Expo Go (e.g., Firebase). This means that as soon as you need to install a library containing native code, you only need to switch from using Expo Go to your custom Development build. The Development build does not need to be created every time; it is sufficient to recreate it only when a new native library is added or configurations in the native code change.

Custom development clients offer the same features and tools as Expo Go. When utilizing custom development clients, you can continue to leverage the Expo CLI for project management. Launching your app is as simple as scanning a QR code or selecting from a list of recently active projects.

There are only two steps to start using it:

Development builds are the future of the Expo development process, except for the early stages of a project.

Expo Router

The Expo team aimed to make the routing system fast and easy to create, maintain, and scale apps with nested native navigation.

Expo Router is a web-like routing system for native apps. It is a file-oriented routing solution designed for mobile and web applications.

The idea of utilizing a file system-driven router is familiar to web developers (PHP and Next.js, etc). However, its application in mobile development is a recent innovation. Its primary function is to facilitate smooth navigation between screens within your application, enabling users to transition seamlessly between various sections of your app’s user interface.

By adopting Expo Router, developers can harness the efficiency of file-system routing principles from web development and apply them to create universal applications.

Expo Router navigation is inherently native and optimized for each platform. Every screen within your application automatically supports deep linking, allowing you to share any route via links easily.

It is SEO-friendly for Web apps. 

Expo CLI can continuously generate static type definitions for every route in your Expo Router app, so it has automatic TS definitions.

It supports async routes. You can bundle your app page by page instead of bundling all at once. This feature is highly beneficial for collaboration within extensive teams or managing massive apps containing thousands of screens.

Expo Router provides a set of Jest utilities that could quickly emulate entire navigation structures.

Expo announced API Routes —

zero-config system for creating server endpoints with a unified build process. This is the first step toward making Expo Router a full-stack React framework

With all of these features, Expo Router is now the first universal, full-stack React routing system.

Push Notifications

Push notifications can be easily integrated into your mobile app using Expo’s Push Notifications service. Expo provides comprehensive documentation and guides for setting up and using push notifications in your app. Whether you’re building a new app or adding push notifications to an existing app, Expo’s Push Notifications service makes it easy to engage with your users and keep them informed about important updates and events.

Expo abstracts away much of the complexity involved in setting up push notifications for both iOS and Android platforms. You only need to obtain push notification credentials from Apple (APNs — Apple Push Notification service) and Google (FCM — Firebase Cloud Messaging), install dependencies, receive the device’s push notification token, and set up notifications handlers. Expo provides detailed documentation on how to set up push notifications for your app. The app can receive background and foreground notifications without any complexity in configurations. You don’t need to worry about native code configuration, installing native libraries and their peer dependencies, etc.

Once push notifications are set up, you can send notifications to your app users using Expo’s Push API. This can be done programmatically from your server or using Expo’s web dashboard. Developers can send notifications to individual devices, groups of devices, or all devices that have installed your app.

Over-the-Air Updates

Expo Updates is a library of the Expo platform designed to simplify managing and delivering over-the-air (OTA) updates to mobile applications built with Expo. It enables developers to deploy updates to their apps directly to users’ devices without going through the traditional app store update process. This is particularly useful for releasing bug fixes, performance improvements, and new features quickly and efficiently.

Expo Updates is fully compatible with Expo’s managed workflow, allowing developers to leverage its capabilities without having to eject to the bare workflow. This makes it accessible to many developers and projects, from beginners to experienced professionals.

The configuration process is extremely fast and easy. You can use the EAS Updates service to publish an update to the build. Expo Updates also supports rollback functionality, so you can be safe from accidentally deployed regression. You can instruct the production app to use the published version and ignore OTA updates.

You can view and test EAS Updates directly from the development build with the new Extensions tab.

Debugging

You can use Chrome DevTools to debug your app's JavaScript code. You can use the full power of web debugging with development builds and Hermes engine (which is a default one): console, breakpoints, source tab, and inspect network requests.

Network debugging is also available even in Expo Go. You can launch it directly from the Expo CLI.

Expo Tools VS Code extension for easier debugging and app config autocomplete. It allows you to debug the app directly in VS Code. It also helps you edit configuration files, such as eas.json or app.json, and shows how your changes in app.json or app.config.js affect the native files, e.g., AndroidManifest.xml, Info.plist, etc.

The Expo team released Expo Dev Tools Plugins. This API allows library creators and app developers to construct browser-based plugins for debugging and interacting with various aspects of their library or application. The Expo team already created several plugins for well-known tools such as Apollo Client, TanStack Query, TinyBase, React Native Async Storage, and React Navigation.

Upgrade Expo SDK

Upgrading Expo projects involves updating various dependencies and configurations to ensure compatibility with the latest versions of Expo tools and libraries. However, as you’ve become accustomed to in this article, all complex and time-consuming operations are always accomplished in just a few lines of code and in much less time than bare React Native.

That’s it. Expo always publishes breaking changes (e.g., https://expo.dev/changelog/2024/01-18-sdk-50#notable-breaking-changes), which you should check during upgrading. If you encounter any issues during testing, refer to the Expo documentation, the release notes, or community forums for guidance on resolving them. You may need to make adjustments to your code, configurations, or dependencies to address compatibility issues.

Expo CLI provides one command, npx expo-doctor@latest, that scans your dependencies and highlights unresolved issues.

The Expo team announces deprecated features/functionality approximately 6 months in advance through regular updates on their blog or in the documentation and adheres to all release plans.

Performance Enhancements

One of the most notable improvements in React Native Expo has been in performance. The Expo team has worked tirelessly to optimize the framework, reducing startup times, improving rendering performance, and minimizing memory usage. Thanks to these efforts, Expo apps run smoother and faster than ever, even in demanding scenarios.

Hermes is now the default JavaScript engine. It is an open-source JavaScript engine optimized for running React Native apps on Android devices. Developed by Facebook, Hermes aims to improve the performance and startup time of React Native apps by employing various optimization techniques. Hermes is optimized for memory efficiency, reducing memory overhead compared to other JavaScript engines.

But it’s always possible to switch back to the JSC engine by adding the property jsEngine in the app.json file.

Some modules, such as expo-crypto, expo-haptics, and expo-localization, were moved to JSI — a powerful feature introduced in React Native to bridge JavaScript and native code seamlessly. JSI allows developers to call native code directly from JavaScript and vice versa, enabling efficient communication between the two environments.

Also, it’s worth mentioning that the Expo CLI became much faster and lighter.

Powerful SDK

The Expo SDK is a set of tools, APIs, and components provided by Expo for building universal apps for iOS, Android, and Web. The Expo SDK now supports almost all device and system functionality such as APIs for Audio and Video playback, file system with background downloads, device motion sensors, secure stores, speech recognizer, library for requesting permission to track the users on devices, libraries to modify the root view background color at runtime, etc.

Expo offers a variety of pre-designed UI components that developers can use to create user interfaces for their apps, such as FlashList, Lottie, MapView, Reanimated, Skia, Stripe, etc.

Community

React Native Expo boasts a robust online presence, with dedicated forums, discussions, and live communication on Discord. Platforms like Reddit and Stack Overflow host active communities where developers exchange ideas, troubleshoot issues, and offer support to fellow enthusiasts.

Comprehensive documentation and tutorials are crucial to the success of any technology, and React Native Expo excels in this area. The official Expo documentation provides detailed guides, API references, and code samples to help developers effectively navigate the platform’s features.

Blog posts created by the Expo team offer insights into best practices, tips, and tricks for leveraging React Native Expo to its full potential. These resources empower developers to quickly get started with the framework and accelerate their learning curve.

The Expo team regularly releases beta versions and collects feedback from developers, such as here. Thus, every developer can directly influence Expo's development. They also welcome developers to discussions on different new modules, as they did with Expo Router.

Other Useful Capabilities

• Provides tools and features that support monorepo setups;
• Offers excellent support for creating full-stack websites using React. Expo websites can be statically rendered to enhance SEO and performance or client-rendered to provide a more application-like experience within the browser;
• Expo Modules API — a powerful set of APIs and utilities to write custom native code.

Conclusion

As we look to the future, the trajectory of the React Native Expo appears promising. With a strong foundation built on performance, native integrations, and community support, Expo is well-positioned to continue its growth and evolution in the years to come. Whether you’re a seasoned developer or just starting, React Native Expo offers a compelling platform for building beautiful, performant, and feature-rich cross-platform applications.

However, it’s also true that Expo may still not be the best fit for every project or development scenario. The choice of development tools and frameworks depends on project requirements, team preferences, and individual developer experience. It’s essential to evaluate the pros and cons of each option carefully and choose the approach that best aligns with your project goals and development philosophy. If you haven’t already, it might be worth revisiting the Expo to see how it has evolved and whether it now better meets your needs.

It seems like Expo aims to go far beyond mobile development and occupy the entire niche of JS development: mobile and web applications and even the back-end.