I have build two app bundles for same application by pure react native (version 0.66) and expo bare workflow (expo eject, expo version: 42.0.1, react-native version: 0.63.4 )
Build by
App bundle size (mb)
Pure react native
29
Expo bare (eject)
14
There is a huge size difference (15 mb) between two app bundles.
When I looked into app bundles for my device I found that config.arm64_v8a.apk has two different sizes.
Build by
config.arm64_v8a.apk(mb)
base.apk(mb)
Pure react native
18.2
12.2
Expo bare (eject)
11.5
12.7
I couldn't find out why config.arm64_v8a.apk has two file sizes in these two flows.
Why expo bare workflow app bundle is so small ? Is this because currently expo use react-native 0.63.4 or does expo has some additional app bundle size reducing method(s) ?
Thank you.
Expo has recently published a blog post about app bundling.
bundle sizes are also smaller by about 18% in “Hello World” apps. This is because many libraries are already shipped in an optimal format, and by needlessly transforming them with a random Babel cocktail, we increase the size, but only a little bit, and everywhere.
I think it's an interesting read (and good source!) for what you're looking for:
https://blog.expo.dev/drastically-faster-bundling-in-react-native-a54f268e0ed1
Put android:extractNativeLibs="true" into the AndroidManifest.xml under application tag
Related
I have just started react native with expo. My first app has only one App.js file and one component of counter. When I have built it, surprisingly my apk size was 49MB :open_mouth: I wonder why its so and how to reduce it without ejecting???
Expo is purely for development purpose , and its only recommended for production if your app is very basic and doesnt have much of native functionalities. Even expo is slower and has much limitations. The larger size of expo is due to the expo wrapper which sits on top of react native , which has a lot of in built modules and thus making it larger.
Recommendation: If you want to lower the apk size , you should migrate to pure react native as expo doesnt give the power of actually decreasing the app size since its handled by expo.
You can even check this link expo -size which also had the same query .
Hope it helps.
Even the simplest app built on EXPO sdk v36 is almost 50MB. Is there a way to reduce the size ?.
I was working with EXPO for some time and until sdk v32, the size was not that big and then it all changed. I expected a solution at least in their new version.
do expo build: android --type app-bundle to get an android app bundle, this bundle will be optimized by Google for different android versions and are smaller in the end.
When expo updates its react-native version to 0.61, using Hermes should decrease your app size significantly and also decrease TTI by up to 2s. I was at React Native EU conference so this is the latest info.
Hope it helps .feel free for doubts
I have installed a react-native app built with expo cli from playstore, I am migrating to react-native cli. I am not able to install the react-native cli build(signed with the same android key) over the existing expo build. I am getting the following error
App not installed, the package conflicts with an existing package by
same name
any solution will be greatly appreciated
Expo and React-native cli are two different things , as i am too implementing both in single app , after that my app start crashing so you can only use one cli at a moment .
here are the difference and merits -demerits of both .
React Native init:
Merits:
You can add native modules written in Java/Objective-C (probably the only but the strongest one)
Demerits:
Needs Android Studio and X Code to run the projects
You can't develop for iOS without having a mac
Device has to be connected via USB to use it for testing
Fonts need to be imported manually in X Code
If you want to share the app you need to send the whole .apk / .ipa file
Does not provide JS APIs out of the box, e.g. Push-Notifications, Asset Manager, they need to be manually installed and linked with npm for example
Setting up a working project properly (including device configuration) is rather complicated and can take time
Expo:
Merits:
Setting up a project is easy and can be done in minutes
You (and other people) can open the project while you're working on it
Sharing the app is easy (via QR-code or link), you don't have to send the whole .apk or .IPA file
No build necessary to run the app
Integrates some basic libraries in a standard project (Push Notifications, Asset Manager,...)
You can eject it to Expo Kit and integrate native code continuing using some of the Expo features, but not all of them
Expo can build .apk and .ipa files (distribution to stores possible with Expo)
Demerits:
You can't add native modules (probably a game changer for some)
You can't use libraries that use native code in Objective-C/Java
The standard Hello World app is about 25MB big (because of the integrated libraries)
If you want to use: Face Detector, Ar Kit o Payments you need to eject it to Expo Kit
Ejecting it to Expo Kit has a trade-off of features of Expo, e.g. you cannot share via QR code
When ejecting to Expo Kit you are limited to the react native version that is supported by Expo Kit at that point in time
Debugging in Expo Kit (with native modules) is a lot more complicated, since it mixes two languages and different libraries (no official Expo support anymore)
And you can use any one which satisfies your applications requirement.
Hope it will make you understand the difference between these two Clis.
I'd like to try expo for faster development.
It's said that you can't use native-module if you use expo.
But it seems it's possible to use native-module if you eject or use bare mode. (not sure if they are the same)
Or it seems it's even possible to start from RN-cli and add expo features.
Are they all the same in what we can do in the end?
How about apk size? Is there a way to cut down the 20-25M file size by starting from RN-cli and adding Expo on top of it or by ejecting ?
I don't think you can do that and achieve 25M File size.
But, I will give you a good solution if you want expo functionality as well as the Native capabilities.
You can try the bare minimum setup with expo.
What it will do is, It will create a react-native init project with unimodules.
Unimodules will have access to some basic expo features, for example permissions etc etc.
And in future if you want to add some other expo feature (which supports bare apps).
You can add them pretty easily.
In expo docs, you can check which features are available in bare apps and which are not.
The main concern for me is that bare apps don't support the background tasks of expo yet.
I always start my apps with this. But the downside would be that the app would be around 30-35mb,
You can still try to minimize it
https://medium.com/#aswinmohanme/how-i-reduced-the-size-of-my-react-native-app-by-86-27be72bba640
Expo has group of packages provided by expo.io. The app built with expo has bigger apk size because we are also bundling the packages which we are not even using. these are the packages comes with expo
https://github.com/expo/expo/tree/master/packages
Best solution to reduce apk size is start with building app without expo then add only required dependencies. If your project needs expo features you can use Expo kit
https://docs.expo.io/versions/latest/expokit/expokit/
Thank you
I did a lot of research now to find out the exact differences and trade-offs between a React Native project, CRNA and an Expo project.
My main guidance was this
However I still don't understand what (dis-)advantages I have using ExpoKit with native code vs. a normal React Native project with native code, apart from the fact that I can't use Expo APIs in a normal React Native project.
I know that when I start a project in Expo I can eject it either as ExpoKit project or as React Native project.
In both I can use native code. In ExpoKit I can still use the Expo APIs in a normal React Native project I can't.
So my questions:
What would be my interest to use a react native project if I can use native code and all Expo APIs in an ExpoKit project? In an ExpoKit project I can still use all Expo APIs and all React Native APIs, right?!
Could I use Expo APIs in a React Native project if I install expo with npm install --save expo?
What is the difference between React Native API and Expo API?
ExpoKit is kind of a hybrid between "pure JS" Expo apps and "vanilla" React Native. At its core it's still a React Native project, but a few things differ about the build system, developer experience, and features available.
Features
As of today, most of the APIs in Expo's SDK are not available in a vanilla React Native project, but they are available in ExpoKit. We think this might change in the future, but it'll be a lot of work.
Expo's push notification service does not currently work in ExpoKit, nor for vanilla React Native.
Build System
Both vanilla RN apps and ExpoKit apps use Xcode and Android Studio to build the native code. iOS ExpoKit apps use CocoaPods to install dependencies, which can add a little bit of complexity to managing the native build. Android ExpoKit apps have additional Gradle configuration to build multiple versions of React Native into the same binary (this is used to enable over-the-air updates of multiple SDK versions of JS), which can sometimes increase the complexity of adding other React Native libraries.
The JavaScript for an ExpoKit and React Native project is built by Metro, although in ExpoKit you need to run Metro using Expo's XDE or exp tools so that they can handle extra configuration for the project. This means you run a command like exp start rather than react-native run-android.
Due to the current design of ExpoKit (although this may change in the future), some open source React Native libraries may have compatibility issues with ExpoKit. For example, if a native library expects to be able to request a reference to React Native's OkHttp instance on Android, there may be a type mismatch when running inside ExpoKit due to the namespacing Expo uses to allow multiple versions of React Native to compile. That said, these issues tend to be pretty rare, and we're working on a few different ways for ExpoKit to be more and more compatible with libraries in the ecosystem.
This multi-version support also means that ExpoKit binaries tend to be larger than corresponding vanilla React Native binaries, although that may change in the future.
Your subquestions
Some developers prefer to manage how their JS bundles and assets are distributed themselves, or they may need a library which isn't currently compatible with ExpoKit. Binary size is another reason why you may prefer vanilla RN.
It's not currently possible to use most Expo APIs in a React Native project. Some APIs available in the Expo SDK are bundled from open source projects (such as react-native-maps) and can be used with a vanilla RN project.
I'm not sure how to parse this question -- Expo APIs are currently just React Native APIs which know how to talk to each other and make certain assumptions about the environment they're running in.
Question from comment 1: You can modify the ExpoKit build all you want, although it may make it slightly harder to upgrade to a newer SDK release depending on how heavily you edit it.
Note to anyone who stumbles across this after 2020 ... ExpoKit has been deprecated so this whole question is moot.
From Expo's documentation: "ExpoKit is deprecated and support for ExpoKit will be removed after SDK 38. We recommend ejecting to the bare workflow instead."