Build Production-Ready Android Apps with Jetpack Compose

A comprehensive guide for building production-quality Android applications with Jetpack Compose, covering project setup, state management, navigation type-safety, and performance optimization. Project setup covers the Compose BOM and library dependencies declared in libs.versions.toml (compose-bom, ui, ui-graphics, ui-tooling-preview, material3, activity-compose). State management follows an MVI/MVVM pattern: a ViewModel exposes UI state as a read-only StateFlow (never a MutableStateFlow directly) backed by an immutable UI-state data class, updating state via _uiState.update { it.copy(...) } inside viewModelScope.launch, with loading/error/success states modeled explicitly. A "Screen" composable collects that state via collectAsStateWithLifecycle and passes plain data plus lambda callbacks down to stateless content composables, which branch on loading/error/success to render the right UI. A worked navigation example shows type-safe Navigation Compose: destinations declared as @Serializable objects/data classes (Home, Profile(userId)), a NavHost wired with composable<T> routes, and typed argument extraction via backStackEntry.toRoute().

Use this skill when starting a new Android project with Jetpack Compose, migrating legacy XML layouts to Compose, implementing complex UI state management and side effects, optimizing Compose performance (recomposition counts, stability), or setting up type-safe Navigation. Use it only when the task clearly matches this scope, and stop to ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.

Given a UI feature description, it produces ViewModel/UI-state code, Screen and stateless content composables, and/or type-safe navigation destinations and NavHost wiring, following the documented anti-pattern list: never perform expensive operations like sorting a list directly inside a composable function body without wrapping it in remember, and never pass a ViewModel instance itself down to child composables.

Jetpack Compose BOM, Material 3, Hilt (hiltViewModel()), and Navigation Compose with kotlinx.serialization-backed type-safe routes.

Android developers building or migrating apps to Jetpack Compose who want established best practices baked in: remember/derivedStateOf to avoid unnecessary recomposition work, @Immutable/@Stable annotations on UI-state classes containing List or other unstable types to enable smart recomposition skipping, LaunchedEffect for one-off side effects like Snackbars, never passing a ViewModel instance down to child composables (only data and callbacks), and debugging infinite recomposition loops by checking for unmembered object creation inside composition or state updates happening outside a side-effect or callback, using Layout Inspector to trace recomposition counts. A worked troubleshooting example specifically calls out infinite recomposition loops caused by creating new List or Modifier instances inside the composition without remember, or by mutating state during the composition phase itself rather than inside a callback or LaunchedEffect side-effect block.