Jetpack Compose

Jetpack Compose is Android’s modern toolkit for building native UI. It simplifies and accelerates UI development on Android. Quickly bring your app to life with less code, powerful tools, and intuitive Kotlin APIs.

I simple words, it’s a revolutionary declarative way of creating UI in Android using Kotlin. Until now, we created layouts using XML and never tried to create via code except for custom views due to its complexity and maintenance issues.

Before moving to Declarative UI, we will talk about the Imperative UI. Imperative UI is the most common paradigm. It involves having a separate prototype of the application’s UI. A good example is XML layouts in Android. We design the widgets and components which are then rendered for the user to see and interact with.

Declarative UI.
This pattern is an emerging trend that allows the developers to design the user interface based on the data received. This on the other hand focuses on the what. This design paradigm makes use of one programming language to create an entire application.

Here we are using Jetpack Compose as Declarative UI, but there are several other declarative UI frameworks like Flutter, React Native and Swift UI.

Difference in Android
let’s take a look at some of the differences between Jetpack Compose and the old XML layout system.

Language
In the Imperative UI system, we had both the XML files and the Java/Koltin files working together to bring about the entire application. In Jetpack Compose, there is only one language used for everything: Kotlin. The business logic and the user interface are created in the Kotlin classes and files.

Theming

Before Jetpack Compose, themes were set in the manifest files. The styles attributes were declared in the resources folder in XML files. You also had material design classes for the themes.
Jetpack compose also comes with a pre-configured Material design theme. You can customize this theme to meet your requirements.

Jetpack Compose with Java

Jetpack Compose is Kotlin exclusive. It uses features as coroutines, and the handling of @Composable annotations is done by a kotlin compiler. There is no way to get access to these from java. So if your project does not support kotlin yet, you can’t use jetpack compose.

Minimum Requirements to use jetpack compose.

Jetpack compose was made with interoperability and integration in mind. Still, you should know the following:

Minimum API Level:
At the moment it’s not possible to use jetpack compose on any OS below Android 5.0 Lollipop (API 21)

Android X:
To use Jetpack compose you need to integrate to the Android X namespace if you haven’t done so yet.

Jetpack Compose effects on performance, build time and apk sizes:

Google claims that Compose saves time and it has better performance than traditional view systems. To prove this they tested with a few applications:

First Application: Tivi
TIVI saw a 46% reduction in APK size from 4.49 MB to 2.39 MB. It also saw a 17% reduction in method count after fully migration to Compose. The XML lines of code decreased by 76%.

When you start adopting Compose in your app, you can see an increase in APK size and build time which will decrease and surpass the original metric once project is fully migrated to Compose.

Integrate with Other Android Best Practices

Compose was built with integration in mind and is able to integrate with every other jetpack library.

Besides Jetpack libraries it’s also easy to integrate with other major and modern libraries, like

• Glide and Coil for image loading.
• Dagger/Hilt for dependency Injection.
• Kotlin Coroutines, Flow for running asynchronous code.
• Retrofit and Ktor for network integration.
• Lottie for animations.

Summary

Jetpack Compose is a promising and powerful modern UI toolkit that you definitely should keep an eye on, if used correctly, it can speed up the development process and reduce the size of the app. Moreover, with compose you write less code which potentially means fewer bugs.