droidcon Online :: Migrating to Compose

While Developing Apps, following a Reactive Architecture (for example MVI, Mobius, Redux, and even MVVM) & Single Source of Truth can get you some big wins including but not limited to, Loose Coupling & Separation of Concerns, Code Testability, and easy debugging, unidirectional data, etc.

However, unlike Web, where Reactive Architectures are the norm, in
Android, Reactive Architecture wasn’t natural till the UI layer, until Compose that is.

Using Compose would require a radical shift in our thought process about app architectures and the way we manage UI. Not only will we have to let go of the habit of calling `findViewById`, but we’ll also need to become accustomed to have our UI completely controlled by states, instead of having multiple flags here and there in the Activity.

Not only that, but the way we manage screens will also be affected, we’ll now have to consider having a Single Activity/Fragment while basing the navigation/Screens completely on Compose functions.

Now, if you’re developing an App from scratch, addressing the above concerns is comparatively easier than when you need to adopt/migrate to Compose in an existing app.

In this session, we’ll discuss the best strategies for adopting/migrating to Compose in different kinds/sizes of apps and talk about challenges you might face while migrating some existing screens to Compose.

Are you thinking is it the best time to invest in Compose? We’ll also talk about that.

Transcript

1. Migrating to Compose
   Rivu Chakraborty
   https://www.rivu.dev/
   

   View Slide

2. https://www.rivu.dev/
   A bit about me
   ● Rivu Chakraborty
   ● Product Engineer @ Gojek
   ● GDE for Kotlin
   ● Author, Speaker, Community
   Person
   ● Ex - Paytm [Insider], Byjus
   https://rivu.dev
   @rivuchakraborty
   

   View Slide

3. https://www.rivu.dev/
   Topics to Discuss
   ● Is Compose ready for Production?
   ● Why should we care?
   ● Is Compose right for us?
   ● How should we plan?
   ● Do we need a new Arch for using Compose?
   ● What are the things to watch out for?
   

   View Slide

4. https://www.rivu.dev/
   Is Compose Ready for Production?
   ● Compose Latest Stable Release: 1.0.1, Alpha Release: 1.1.0-alpha01
   

   View Slide

5. https://www.rivu.dev/
   Is Compose Ready for Production?
   ● Compose Latest Stable Release: 1.0.1, Alpha Release: 1.1.0-alpha01
   ● Apps started using Compose:
   ○ Google Play Store
   ○ Twitter
   ○ Airbnb
   ○ Monzo
   More details here:
   https://developer.android.com/jetpack/compose/why-adopt#testimonials
   

   View Slide

6. https://www.rivu.dev/
   Why Should We care?
   ● Developer Perspective
   ○ Write better debuggable and functional UI code
   

   View Slide

7. https://www.rivu.dev/
   Why Should We care?
   ● Developer Perspective
   ○ Write better debuggable and functional UI code
   ○ Ability to utilise complete Reactive patterns throughout the App
   

   View Slide

8. https://www.rivu.dev/
   Why Should We care?
   ● Developer Perspective
   ○ Write better debuggable and functional UI code
   ○ Ability to utilise complete Reactive patterns throughout the App
   ○ Less logic in Activity
   

   View Slide

9. https://www.rivu.dev/
   Why Should We care?
   ● Developer Perspective
   ○ Write better debuggable and functional UI code
   ○ Ability to utilise complete Reactive patterns throughout the App
   ○ Less logic in Activity
   ○ Option to go for Single Activity, with screens separated by Compose
   

   View Slide

10. https://www.rivu.dev/
    Why Should We care?
    ● Developer Perspective
    ○ Write better debuggable and functional UI code
    ○ Ability to utilise complete Reactive patterns throughout the App
    ○ Less logic in Activity
    ○ Option to go for Single Activity, with screens separated by Compose
    ○ Can be an incremental migration with Interoperability
    

    View Slide

11. https://www.rivu.dev/
    Why Should We care?
    ● Product / Manager Perspective
    ○ UI being better debuggable and unit testable, less possibility of bugs??
    

    View Slide

12. https://www.rivu.dev/
    Why Should We care?
    ● Product / Manager Perspective
    ○ UI being better debuggable and unit testable, less possibility of bugs??
    ○ Easier to write Declarative UI => Less time fixing that 5dp margin 🤪
    

    View Slide

13. https://www.rivu.dev/
    Why Should We care?
    ● Product / Manager Perspective
    ○ UI being better debuggable and unit testable, less possibility of bugs??
    ○ Easier to write Declarative UI => Less time fixing that 5dp margin 🤪
    ○ Server Driven UI
    

    View Slide

14. https://www.rivu.dev/
    Why Should We care?
    ● Product / Manager Perspective
    ○ UI being better debuggable and unit testable, less possibility of bugs??
    ○ Easier to write Declarative UI => Less time fixing that 5dp margin 🤪
    ○ Server Driven UI
    ○ Can be an incremental migration with Interoperability
    

    View Slide

15. https://www.rivu.dev/
    Why Should We care?
    ● Product / Manager Perspective
    ○ UI being better debuggable and unit testable, less possibility of bugs??
    ○ Easier to write Declarative UI => Less time fixing that 5dp margin 🤪
    ○ Server Driven UI
    ○ Can be an incremental migration with Interoperability
    -- With Compose for Desktop and Web now in Alpha, in near future, coupled with
    KMM, can be a good bet against Cross-platform Frameworks
    

    View Slide

16. https://www.rivu.dev/
    Is Compose right for us?
    Short Answer: YES
    Broad Answer: It depends
    

    View Slide

17. https://www.rivu.dev/
    How should we plan?
    ● General Suggestion
    ○ Move to a State based Arch
    ○ Start migration atomically screen by screen
    

    View Slide

18. https://www.rivu.dev/
    How should we plan?
    ● We have a design System (Custom Views for each Component)
    ○ Start replacing the simplest Views (e.g. CustomTextView)
    ○ From product side follow the previous steps to atomically migrate to
    Compose
    

    View Slide

19. https://www.rivu.dev/
    How should we plan?
    ● I have a 4000 lines View Class
    ○ Keep that class for last item to Migrate
    ○ Try to break down the logic to properly organise them, and if possible in
    separate classes
    ○ Write Unit (if possible) and UI test cases to verify existing functionality
    ○ Rewrite the View in Compose and run the test cases
    

    View Slide

20. https://www.rivu.dev/
    Do we need a new Arch for using Compose?
    ● Short Answer: No
    ● Time investment required in State Management? Yes
    

    View Slide

21. https://www.rivu.dev/
    What are the things to watch out for?
    ● Recursive Recomposition -> Happens when you update the state of a
    Compose from inside the function
    ● Too much logic in Compose Functions
    

    View Slide

22. https://www.rivu.dev/
    Resources
    ● Jetpack Compose: Missing piece to the MVI puzzle? by Garima Jain:
    https://medium.com/google-developer-experts/jetpack-compose-missing-pi
    ece-to-the-mvi-puzzle-44c0e60b571
    ● Jetpack Compose - MVI Demo Project:
    https://github.com/RivuChk/Jetpack-Compose-MVI-Demo
    ● Compose Academy: https://compose.academy/
    ● Jetpack Compose internals 📖 by Jorge Castillo:
    https://jorgecastillo.dev/book/
    

    View Slide

23. Thanks!
    Rivu Chakraborty
    Twitter: @rivuchakraborty
    Website: https://rivu.dev
    

    View Slide