Elevating your App’s performance

With apps being developed at a rapid pace for diverse locales and users, it is crucial to continuously enhance app performance to provide an exceptional user experience. This talk will focus on strategies to improve app performance and empower developers to create high-performing apps. In this talk we will cover:Understanding the Baseline Profile, Explore how we practical approached to seamlessly integrate the Baseline Profile into a popular app with over 50 million downloads, How specific improvements were made during the critical user journey positively impacted app conversion rates, Let's understand the techniques to enhance the performance of Jetpack Compose layouts, Tips and Tricks for Boosting App Performance By the end of the talk, we will be equipped with practical knowledge and actionable strategies to power up their apps and enhance their performance.

Transcript

1. Elevating NordVPN App’s performance
2. Agenda. • Understanding why we need App performance. • How we can approach app performing good? • Integrating performance nitty grittier using Jetpack Compose. • Understanding Baseline profiles and improvements. @hi_man_shoe
3. Basic Implementation. Jetpack Compose @hi_man_shoe
4. @hi_man_shoe
5. But there are lot of Things beyond this right? Jetpack Compose @hi_man_shoe
6. @hi_man_shoe
7. @hi_man_shoe
8. Baseline Profiles The magic is called: @hi_man_shoe
9. But let’s understand what is the it does Baseline Profile MAGIC @hi_man_shoe
10. AoT . @hi_man_shoe Ahead of Time
11. JiT . @hi_man_shoe Just in Time
12. @hi_man_shoe Theory Over!
13. @hi_man_shoe Baseline Profile : 02 File > New > New Module
14. @hi_man_shoe Baseline Profile : 02 AndroidManifest.xml <application> <profileable android:enabled="true" android:shell="true" tools:targetApi="q" /> </application>
15. @hi_man_shoe Baseline Profile : 02 *.gradle benchmark { initWith buildTypes.release versionNameSuffix '+benchmark' signingConfig signingConfigs.debug matchingFallbacks = ['release'] debuggable false proguardFiles('baseline-profiles-rules.pro') }
16. @hi_man_shoe Baseline Profile : 02 AndroidManifest.xml benchmark { initWith buildTypes.release versionNameSuffix '+benchmark' signingConfig signingConfigs.debug matchingFallbacks = ['release'] debuggable false proguardFiles('baseline-profiles-rules.pro') }
17. @hi_man_shoe Baseline Profile : 02 baseline-profiles-rules.pro -dontobfuscate
18. @hi_man_shoe Baseline Profiles What will it do? How we do and work with it?
19. @hi_man_shoe We need to setup any critical user flow that we want to improve the speed for! Baseline Profile
20. @hi_man_shoe Base Setup for Generator @RunWith(AndroidJUnit4::class) abstract class BaselineProfileGeneratorScaffold { @get:Rule val rule = BaselineProfileRule() abstract fun MacrobenchmarkScope.invoke() @Test fun profileGenerator() { rule.collectBaselineProfile( packageName = PACKAGE_NAME, maxIterations = 15 ) { startActivityAndWait() invoke() } } }
21. @hi_man_shoe Base Setup for Generator @RunWith(AndroidJUnit4::class) abstract class BaselineProfileGeneratorScaffold { @get:Rule val rule = BaselineProfileRule() abstract fun MacrobenchmarkScope.invoke() @Test fun profileGenerator() { rule.collectBaselineProfile( packageName = PACKAGE_NAME, maxIterations = 15 ) { startActivityAndWait() invoke() } } }
22. @hi_man_shoe Base Setup for Generator @RunWith(AndroidJUnit4::class) abstract class BaselineProfileGeneratorScaffold { @get:Rule val rule = BaselineProfileRule() abstract fun MacrobenchmarkScope.invoke() @Test fun profileGenerator() { rule.collectBaselineProfile( packageName = PACKAGE_NAME, maxIterations = 15 ) { startActivityAndWait() invoke() } } }
23. @hi_man_shoe Baseline Profiles Setup Complete.
24. @hi_man_shoe Startup Baseline Profile Generation class StartupBaselineProfileGenerator : BaselineProfileGeneratorScaffold() { override fun MacrobenchmarkScope.invoke() { startActivityAndWait() } }
25. @hi_man_shoe class StartupBaselineProfileGenerator : BaselineProfileGeneratorScaffold() { override fun MacrobenchmarkScope.invoke() { startActivityAndWait() } } Startup Baseline Profile Generation
26. @hi_man_shoe class StartupBaselineProfileGenerator : BaselineProfileGeneratorScaffold() { override fun MacrobenchmarkScope.invoke() { startActivityAndWait() } } Startup Baseline Profile Generation
27. @hi_man_shoe class StartupBaselineProfileGenerator : BaselineProfileGeneratorScaffold() { override fun MacrobenchmarkScope.invoke() { startActivityAndWait() } } Startup Baseline Profile Generation
28. @hi_man_shoe class AnotherBaselineProfileGenerator : BaselineProfileGeneratorScaffold() { override fun MacrobenchmarkScope.invoke() { with(device) { findObject(….) } } } Another Baseline Profile Generation
29. Execute. • Add Baseline profile grade plugin • ./gradlew :app:generateBaselineProfile • ./gradlew :app:generate{variant}BaselineProfile • Run on Release build always. @hi_man_shoe
30. Device. @hi_man_shoe • Run on Rooted device • Gradle Manage Device with AOSP image • */src/release/generated/baselineProfiles
31. @hi_man_shoe */baseline-prof.txt File name
32. @hi_man_shoe This will be shipped with aab/apk. Result
33. @hi_man_shoe Create Release Branch Trigger CI for Baseline Profile Commit the generated Code Release Release process at NordVPN
34. @hi_man_shoe
35. @hi_man_shoe Compose’s Performance.
36. @hi_man_shoe Recomposition in Compose Draw on init Any change ReDo it again.
37. @hi_man_shoe Always use Stable parameters in Composable function Jetpack Compose
38. Stable/Unstable. • If a composable has stable parameters that have not changed, Recomposition won’t happen • If a composable has unstable parameters it will always recomposes itself when it re-composes the component's parent. @hi_man_shoe
39. @hi_man_shoe So what are Stable Params? Jetpack Compose
40. Stable Params • data class should be with val • We should not pass Collections / Observers • Pass Wrapper classes or Kotlin.Immutable collection or any custom classes. @hi_man_shoe
41. Wrapper Class @hi_man_shoe @Immutable data class CustomerStateCollection( val items: List<String> = emptyList(), )
42. @hi_man_shoe How do we test the unstability for Composables?
43. @hi_man_shoe Layout Inspector
44. @hi_man_shoe Layout Inspector
45. @hi_man_shoe Compose Compiler Reports: A report that tells us how the App’s Compose Code.
46. @hi_man_shoe Compose Compiler Reports: subprojects { tasks.withType(org.jetbrains.kotlin.gradle.tasks.KotlinCompile).configureEach { kotlinOptions { if (project.findProperty("composeCompilerReports") == "true") { freeCompilerArgs += [ "-P", "plugin:androidx.compose.compiler.plugins.kotlin:reportsDestination=" + project.buildDir.absolutePath + "/compose_compiler" ] } if (project.findProperty("composeCompilerMetrics") == "true") { freeCompilerArgs += [ "-P", "plugin:androidx.compose.compiler.plugins.kotlin:metricsDestination=" + project.buildDir.absolutePath + "/compose_compiler" ] } } } }
47. @hi_man_shoe Compose Compiler Reports: subprojects { tasks.withType(org.jetbrains.kotlin.gradle.tasks.KotlinCompile).configureEach { kotlinOptions { if (project.findProperty("composeCompilerReports") == "true") { freeCompilerArgs += [ "-P", "plugin:androidx.compose.compiler.plugins.kotlin:reportsDestination=" + project.buildDir.absolutePath + "/compose_compiler" ] } if (project.findProperty("composeCompilerMetrics") == "true") { freeCompilerArgs += [ "-P", "plugin:androidx.compose.compiler.plugins.kotlin:metricsDestination=" + project.buildDir.absolutePath + "/compose_compiler" ] } } } }
48. @hi_man_shoe Compose Compiler Reports: subprojects { tasks.withType(org.jetbrains.kotlin.gradle.tasks.KotlinCompile).configureEach { kotlinOptions { if (project.findProperty("composeCompilerReports") == "true") { freeCompilerArgs += [ "-P", "plugin:androidx.compose.compiler.plugins.kotlin:reportsDestination=" + project.buildDir.absolutePath + "/compose_compiler" ] } if (project.findProperty("composeCompilerMetrics") == "true") { freeCompilerArgs += [ "-P", "plugin:androidx.compose.compiler.plugins.kotlin:metricsDestination=" + project.buildDir.absolutePath + "/compose_compiler" ] } } } }
49. @hi_man_shoe Compose Compiler Reports: ./gradlew assembleRelease -PcomposeCompilerReports=true
50. @hi_man_shoe Compose Compiler Reports: ./gradlew assemble{VARIANT}Release -PcomposeCompilerReports=true
51. @hi_man_shoe Compose Compiler Reports: • module-class.txt : A report on the stability of classes in this • module-composables.txt : A report on how restartable and skippable the composables are. • module-composables.csv : A CSV Version of report.
52. @hi_man_shoe composables.txt restartable scheme("[androidx.compose.ui.UiComposable]") fun ServerList( stable index: Int unstable servers: List<Servers> stable OnServerClick: Function1<Long, Unit> stable modifier: Modifier? = @static Companion )
53. @hi_man_shoe composables.txt restartable scheme("[androidx.compose.ui.UiComposable]") fun ServerList( stable index: Int unstable servers: List<Servers> stable OnServerClick: Function1<Long, Unit> stable modifier: Modifier? = @static Companion )
54. Fix. @hi_man_shoe @Immutable data class ServerCollection( val servers: List<Server> = emptyList(), )
55. Or . @hi_man_shoe @Immutable data class ComposeCollection<T>(val data: List<T>)
56. Or . @hi_man_shoe @Immutable data class ComposeCollection<T>(val data: List<T>)
57. @hi_man_shoe How we do @NordVPN Pull Request Run the Compiler check Comment in PR
58. @hi_man_shoe
59. @hi_man_shoe With this, Thank you!