Blogs

Tools

Quick Links

Mridul.tech

How to reduce React Native APK Size?

Mridul Panda

Mridul Panda

Feb 18, 2024

·

2 Min Read

How to reduce React Native APK Size?
How to reduce React Native APK Size

In the ever-evolving landscape of mobile app development, optimizing React Native APK size is crucial for delivering a seamless user experience. Developers often grapple with bloated APKs, hindering app downloads and user retention. This comprehensive guide unveils practical steps to efficiently reduce React Native APK size, ensuring your application remains agile and user-friendly.

Also Read: How to change Status Bar Background Color in React Native

Create a separate APK for each CPU

For both x86 and ARMv7a CPU architectures, the native code is included in the resulting APK by default. This facilitates the sharing of APKs compatible with nearly every Android device. The drawback of this is that any device will have some useless native code, which will result in unnecessarily larger APKs.

You can create an APK for each CPU by changing the following line in android/app/build.gradle

def enableSeparateBuildPerCPUArchitecture = true

Enable Proguard for APK

If you are using the React Native version less than ^0.73.0 then you can use this.

One tool that can help with APK size reduction is Proguard. In android/app/build.gradle, modify the following line to enable Proguard:

def enableProguardInReleaseBuilds = true

You may now optimise your code by enabling minifyEnabled and shrinkResources in your build release after turning on Proguard. To enable, edit android/app/build.gradle.

release {
     debuggable false
     shrinkResources true
     minifyEnabled true
     useProguard true
     setProguardFiles([getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'])
}

Also Read: How to Change React Native App Icon for iOS and Android

Optimize Images to reduce React Native APK Size

By using image compressor tools, you can reduce the size of your photographs by 50–80%. I was able to cut the size of my asset by 50% by using this technique. Optimising your project photos will speed up app loading in addition to lowering the size of your app’s APK.

Here are some image compressor tools that I use:

Also Read: How to add Grid Layout in React Native

Split APKs to reduce React Native APK Size

If you are using React Native version more than ^0.73.0, then you have to changes one more setting to split the apks. edit android/app/build.gradle and add the following config in the build config. it will split the apk for “armeabi-v7a”, “arm64-v8a”, “x86”, “x86_64”

splits {
    abi {
        reset()
        enable true
        universalApk false
        include "armeabi-v7a", "arm64-v8a", "x86", "x86_64"
    }
}

Conclusion

Reducing React Native APK size is a multifaceted process that demands a strategic approach. By meticulously addressing the components impacting size, optimizing assets, and implementing advanced bundling techniques, developers can ensure their apps remain nimble and responsive. Stay updated with the latest tools and techniques, and continuously audit and optimize to provide users with an unparalleled mobile experience.

Do you want more articles on React, Next.js, Tailwind CSS, and JavaScript?

Subscribe to my newsletter to receive articles straight in your inbox.

If you like my work and want to support me, consider buying me a coffee.

Buy Me A Coffee

Contact Me ☎️

Discuss A Project Or Just Want To Say Hi?
My Inbox Is Open For All.

Mail : contact@mridul.tech

Connect with me on Social Media

Contact Art