compose-side-effects
Compose: side effects
Core principle
Composable bodies describe UI. They can be recomposed, skipped, or abandoned. Work that changes the outside world belongs in an effect API whose lifecycle matches the work.
Pick the smallest effect
| Need | API |
|---|---|
| Publish Compose state to non-Compose code after every successful recomposition | SideEffect |
| Register/unregister a listener, callback, observer, or resource | DisposableEffect(keys...) |
| Run suspending, deferred, or keyed one-shot work | LaunchedEffect(keys...) |
| Launch suspending work from a user event callback | rememberCoroutineScope() |
| Convert Compose snapshot reads into a Flow inside a coroutine | snapshotFlow { ... } inside LaunchedEffect |
Effect keys
Keys define restart identity. When any key changes, the old effect is cancelled/disposed and a new one starts.
More from chrisbanes/skills
compose-ui-testing-patterns
Use when writing or reviewing Jetpack Compose UI tests, screenshot tests, previews, semantics assertions, fake image loading, keyboard input, focus assertions, interaction state (hover/pressed/focused), or tests for plain state-driven UI composables.
162kotlin-coroutines-structured-concurrency
Use when writing or reviewing Kotlin code that stores CoroutineScope, launches from init/non-suspending APIs, calls runBlocking, or catches broad exceptions around suspend calls.
162compose-modifier-and-layout-style
Use when writing or reviewing Jetpack Compose layout APIs, modifier parameters, modifier chain construction, hardcoded root layout decisions, or layout wrappers around a single conditional.
161compose-stability-diagnostics
Use when writing or reviewing Jetpack Compose parameter stability, compiler reports, skippability, unstable UI state classes, collection parameters, or Kotlin 2.0+ strong skipping behavior.
160compose-state-authoring
Use when writing or reviewing Jetpack Compose code with bare local var in a @Composable, remember { mutableStateOf(...) }, mutableStateListOf/mutableStateMapOf, or @ReadOnlyComposable.
159compose-state-deferred-reads
Use when Jetpack Compose code reads scroll, animation, gesture, or other frame-rate State in composition, passes changing values across composable boundaries, or uses value-form layout/draw modifiers.
159