Reducing app size in Flutter mobile app development

This article is about methods and techniques that we can follow to reduce the size of our application. We developed an Android app with Flutter.

But surprisingly, the size of the debug app is bigger compared to the natively developed android app. So we looked for a way to reduce the size of the app and tried to reduce the size of the mobile app. So finally we found some solutions to solve this problem. We have reduced the size of the application.

If you are a mobile app developer, you definitely care about the size of your app and always try to build small apps and use techniques to reduce size. In the age of 4G and modern smartphones, size reduction has become one of the important and essential processes when delivering apps to users, as people prefer smaller apps, many users will Avoid and think twice. According to a report, most smartphone users have limited data plans, so they don't like spending their data packages on a single app. During the encoding process, we need to optimize to minimize the size of the application.

There are two dimensions to measure application size

• Download Size - The size of the app in the Play Store (when downloaded)
• Install Dimensions - This can be seen after installing the app. This is what happens when you download the app, unzip it, compile it and optimize it. This will greatly expand the application, perhaps two or three times the size of the installation, or even more.

Download size

When the user installs an app from the play store, he sees the loading bar and then the actual app size. With 2.59 million apps on the Play Store, according to Google, it's no wonder that convincing users to install your app has never been more difficult. The larger the app, the greater the chance of download failure/cancellation. As developers, we want to keep our app small so that our app gets as much spread as possible.

installation size

This also has a similar phenomenon. Users fill their phones with video, audio, and images, they'll try to install a new app, and oops, there's no room left. They'll go look for space, go to settings, and check which app is consuming more space. Even when trying to download from the Play Store, it suggested them to delete some apps to accommodate the new ones and even gave them some advice.

There are many good coding practices, and establishing a stable architecture will help applications perform better. There are some common methods and practices that you can implement in your application to make it even better.

Some solutions to reduce application size:

1. Compress PNG and JPG

You should compress your PNGs and JPGs whenever you have to use an image within your application (such as a walkthrough screen) and you don't want to call the image from an external host, as high-quality images will increase the size of your application. You can do a quick Google search for tools to compress PNGs and JPGs.

2. Use web images

In Flutter, developers use images in the assets folder, which is helpful for fast loading of images. But when you store these images in your app, assets add more bulk to your app. The solution is to use web images. Upload the image in a permanent storage path, such as Firebase Storage, or AWS, and use a link to that image in your code. This approach can also help you reduce the size of your application.

3. Cache

Caching is a very important thing if you are using images from the web, caching will not help reduce the size of the application, but it will make the application load faster and improve the performance of the application. All commonly used pictures, such as profile pictures, background pictures using the cached_network_image plugin.

cached_network_image package allows you to use any widget as a placeholder. It can be found in pub.dev.

4. Use icons in .svg format

We can get some benefits from using vector drawing. No need to worry about different device DPI, this also helps to reduce apk size.

When you download system application icons from Google's Material Design icon library, download the .svg format instead of .png, .svg images can help you reduce the size of your application.

5. Use a valid library

Remove all unused packages in the pubspec.yaml file. Once you have finished building your application, you should review your pubspec.yaml, remove unused libraries, and remove all unused assets from pubspec.yaml.

6. Use Google Fonts

Fonts are a very important basic thing in an application. They are heavy and get stuck in the app. You need fonts to provide the best user experience for your users and it will help you build a beautiful application. You might want to use google_fonts package instead of bundling the font in your app. With the google_fonts package, .ttf or .otf files do not need to be stored in your assets folder and mapped into the pubspec.yaml file. Instead, they can be fetched once at runtime over HTTP and cached in the application's file system. This is similar to downloadable fonts in native android development. You can check out the google font package on pub.dev. There you can find a lot of different fonts from Google Fonts.

Using Proguard

Proguard is a java program optimizer. It optimizes your code in a way that doesn't change the functionality but changes the representation to make it more compact. It obfuscates the names of types, fields, and methods whose original names don't matter, in order to replace long names with short strings like a and b for efficiency. Package and class names can be long, but should not affect efficiency. It also removes unused java code from dependencies. To set up proguard, make sure the build type in <app dir>/android/app/build.gradle looks like this:

 buildTypes {
  release {
    minifyEnabled true // add this
    proguardFiles getDefaultProguardFile(‘proguard-android.txt’), ‘proguard-rules.pro’ // add this
    signingConfig signingConfigs.release // this is the default for release 
  }
}

In the same directory, create the file proguard-rules.pro and add the following code:

 ## Flutter wrapper

-keep class io.flutter.app.** { *; }

-keep class io.flutter.plugin.** { *; }

-keep class io.flutter.util.** { *; }

-keep class io.flutter.view.** { *; }

-keep class io.flutter.** { *; }

-keep class io.flutter.plugins.** { *; }

# -keep class com.google.firebase.** { *; } // uncomment this if you are using firebase in the project

-dontwarn io.flutter.embedding.**

-ignorewarnings

You should also go to gradle.properties and add the following snippet to it:

 extra-gen-snapshot-options= — obfuscate

Resource Shrinking

This extends proguard's concept of dead code elimination to resources. Your build type in your build.gradle file in the <app dir>/android/app directory (where you added the proguard fragment) should now look like this:

 buildTypes {
  release {
    minifyEnabled true // added previously
    shrinkResources true // add this
    proguardFiles getDefaultProguardFile(‘proguard-android.txt’), ‘proguard-rules.pro’ // added previously
    signingConfig signingConfigs.release // added previously
  }
}

Size Analysis Tool

The new version of Flutter includes sizing tools to help developers understand the breakdown of their app's release builds. Invoke the size analysis tool by passing the --analyze-size flag at build time:

• flutter build apk --analyze-size
• flutter build appbundle --analyze-size
• flutter build ios --analyze-size
• flutter build linux --analyze-size
• flutter build macos --analyze-size
• flutter build windows --analyze-size

remove unnecessary things

It is very effective to analyze and optimize the widest range of files and folders. <br /> To test the published android application, run the following command on the terminal:

 flutter build apk --split-per-abi

You will get three apk files from the build/app/output/apk/release folder. You can test the v7 version of the apk file. If you want to publish your app on the google play store, please do not upload any of the files below.

Use Google's recommended app bundles.
To generate the application package, run the following command on the terminal:

 flutter build appbundle --target-platform android-arm,android-arm64,andro

After that you will get a .aab build/app/output/appbundle/release . Now you can upload this .aab file to google play store.