Breaking it Down: React Native Expo vs React Native CLI — A Comprehensive Comparison.

The Frontend Forge
7 min readJul 3, 2023

--

React Native has revolutionised how we develop mobile applications, powering 38% of the total mobile applications market according to fireart studio, offering us as developers the core ability to write and deploy one code on Android and IOS platforms.

As a React Native developer, one of the biggest challenges I faced when I began my journey years back was “How to get started”… Yh, funny, right?

React Native has two ways of setting it up, which might ultimately determine your path in your React Native development journey.

React Native CLI or React Native Expo.

I’ll explain the significant difference between the two methods, the pros & cons of each and why many developers have a specific perceived notion towards “using expo.”

This is a very wrong and outdated opinion, which I will be debunking as we progress in this article.

Let’s Start With a Trip Down Memory Lane.

Sometime in 2015, Facebook (now known as Meta) pushed up React Native 1.0 as a UI framework built on React that compiles javascript code into Obj-C + Swift for native IOS and Java + Kotlin for Android.

I think that same year at React Rally, Charlie Cheever presented Exponent (expo) — a toolkit framework built to streamline developing React Native applications.

This is not new, especially in the frontend tech ecosystem — having a framework built to extend another framework — more like the Ironman suit.

But with Exponent, things were a bit different — for one: upon the release of Expo, it became the default recommended environment to develop React Native projects by the React Native team as against their own built-in React Native CLI.

This is because Expo has built a bridge that connects React Native and core Native mobile application development from an opinionated perspective.

In simpler terms, they created a standard of development for React Native applications that was fast and efficient.

However, these could not necessarily be merged into React Native as it would limit some of the controls it gave to developers — however not always needed.

Understanding React Native CLI

React Native CLI happens to be the official command-line interface for React Native. Hence the more traditional approach of developing mobile apps using react native. It gives developers complete control over the project configuration and the build process.

It allows developers to interact directly with pure native code, providing flexibility for complex scenarios and even fine-tuning the app’s performance on a granular level.

Exploring React Native Expo

On the flip side, React Native Expo is an open-source project created by a group of developers to simplify and streamline the complicated React Native CLI process.

React Native Expo is a set of tools, libraries and services built around React Native, making it more accessible to a broader range of developers. It provides a curated development environment that allows React Native developers to quickly start building without the need for complex configurations — by offering pre-built components and APIs that make adding functionalities to your project easier.

Comparing React Native CLI and Expo

1. The Power of Preconfigured Environment

Putting into context, setting up a React Native project for the first time using the CLI can take you up to 4 hours.

  • Downloading & Installing Dependencies (separately for both Android & IOS)
  • Installing React Native CLI
  • Creating your new application
  • Preparing the Android & IOS devices
  • Running the RN Application

Whereas, setting up the same project using expo would take you about 4–5 mins with the same internet speed

To understand why this is, you need to know how they both work:

React Native, as earlier stated, compiles JS into native code binaries, and to do this with React Native CLI, it requires Xcode for IOS and Android Studio for Android. When writing this article, Xcode is about 12Gb, and Android Studio is about 7Gb in file size. Assuming you could download both in good time, you still have to configure your environment, such as installing a simulator & installing cocoa pods, before you get into creating your application.

npx react-native@latest init [app name]

On the other hand, Expo broke all these complicated processes into separate services/components — the fact is Expo is broken down into four different components/services:

  • Expo SDK
  • Expo Go
  • Expo Dev Clients
  • EAS

Each component houses different needs and use cases you would need to get your app ready for market.

For instance, to get started with Expo SDK, you only need to run the following:

npx create-expo-ap [App Name]

This installs the basic modules you need to run a simple and functional mobile application on Android and IOS, and it gives you access to specific pre-built libraries available in expo docs.

All you need to do is install the right expo library package.

Expo GO is an open-source app you can download from the stores on Android and IOS devices to test your mobile application during development.

2. A Plethora of Pre-Built Components and Modules

One Standout advantage of React Native Expo is its vast library of pre-built modules and components — from integration modules to default device capabilities like file system explorer to integration with popular services such as Firebase, Stripe, Facebook Authentication and many more.

As developers, leveraging these prebuilt resources helps accelerate your app development process, reduce code complexity and deliver exceptional user experiences.

In defence of React Native CLI, you can also achieve all these. You can go deeper and more granular when configuring device capabilities or even how certain services work specific to one, either IOS or Android — or both. However, a primary or granular configuration could get complicated and take a while to get done, not to talk about the demonic gradle or cocoapods frequent hullabaloos.

3. Supercharged Customization Options

Now here’s where many of the Nay-sayers have always pitched their tents regarding React Native Expo.

While React Native CLI offers more flexibility in terms of customisation, which you rarely need for 99% of most apps out there… It’s been believed that Expo gives you no control when it comes to customising or using native modules on your app without ejecting, except for the pre-built modules that come with the Expo SDK environment.

This was true for a while with Expo. However, this has changed since the Expo version 45 update, which introduced the Expo EAS services and the Expo Dev Client ecosystem.

Expo Dev Clients saw the introduction of an open-source framework where developers can build a personalised “Expo Go” like application that’s no longer limited to the limitations of Expo Go. In literal terms, you can integrate 99% of native packages without limit, build a new “dev client” app, and have it work seamlessly.

Now this changes EVERYTHING when it comes to using Expo; as long as there’s a React Native package that solves that task, it can integrate with your Expo app.

4. Simplified Build Process

Welcome to the world of Expo EAS Service. As a lover of React Native Expo, Trust me when I tell you I can’t get enough of this service; it’s just 👌

Expo Application Service (EAS) is a set of FREEMIUM services that allows “React Native” developers to build apps for either production, staging or development environments. It also has a service that can help you submit your apps to stores straight from your command line.

Now one service they offer that is just awesome is their OTA updates.

Over The Air Updates, or OTA as it’s popularly known, allows developers to push updates to their app directly on the user’s device without first pushing the update to the store.

With this service, minor JS-related bugs and enhancements don’t have to go to the store before users can access it; with just a command, your updates are received by the users almost instantly.

For me, as a React Native developer that works in a start-up where we make a lot of frequent updates fast, this helps us limit the number of updates we push to the stores regularly to only when we have significant milestones or features introduced.

It is important to note that the EAS service is not open-source. It is freemium — it has a free version with certain limitations, but you get the full power on its premium version.

Initially, it was believed that because certain features and native packages are not technically compatible with Expo Go, in other words, it is not compatible with Expo. Even though, at a time, this was partially true. However, these concerns and beliefs have mainly been handled by introducing Expo Dev Clients and EAS.

React Native Expo offers several advantages over React Native CLI for mobile app development whilst moving quickly to ultimately bridge the limitations between them.

I would have loved to create an FAQ section to answer other questions I’ve seen about Expo, but not to make this article lengthier; I might create a separate article on that.

By embracing Expo, developers unlock simplicity, productivity and performance, all while shattering misconceptions along the way. As the mobile landscape continues to evolve, React Native Expo remains a steadfast companion, empowering us as developers to create remarkable experiences and reshape the future of cross-platform development.

--

--

The Frontend Forge
The Frontend Forge

Written by The Frontend Forge

Sharpen your frontend skills at The Frontend Forge! 🔥 Join me as I break down JS, TS, React, Vue, React Native, & Next.js with insightful articles & tuts. 💻

Responses (2)