What triggers recomposition?

Jetpack Compose Mid-level Kotlin 2.0+ API 24+ Reviewed By Best Latest Apps

Predict the output

The user taps the button once. Which composables run again?

@Composable
fun Screen() {
    var count by remember { mutableStateOf(0) }
    Column {
        Header(title = "Cart")
        Button(onClick = { count++ }) { Text("Add") }
        Text("Items: $count")
    }
}

@Composable
fun Header(title: String) { Text(title) }
Options
Hint 1 of 2

Where is count read?

Hint 2 of 2

Did Header's parameter change?

Choose an answer, then open Show answer below to check it.

Show answer

Answer: A Screen's body runs again, Header is skipped

Correct. Screen read count, so it re-runs; Header's parameter didn't change, so it's skipped.

Why not the others?
  • B Only the Text that shows the count. count is read in Screen's body (to build the string), so Screen's scope re-runs.
  • C Everything, including Header. Header gets the same title, so Compose skips it.
  • D Nothing; you must call invalidate(). Changing a State is enough.
Indented composable list: Screen, Header, Button and Text with recomposition counts after one tap.

Illustrative, based on Compose and Android rules; not a device recording

Text version
Recompositions after: Tap Add once
Composablecount read in Screencount read in a child
Screen1 recomposition0: skipped
 Header0: skipped0: skipped
 Button0: skipped0: skipped
 Text1 recomposition1 recomposition

30-second answer

Recomposition is Compose re-running composable functions to update the UI. It happens when a State object that a composable read during its last run changes. Compose then re-runs the smallest scopes that read it and skips children whose parameters haven't changed. It's driven by state reads, not by anything you call.

Practise saying it · 35 s. No recording, just a timer

Explain what triggers recomposition.

Say your answer out loud, then check which of these points you covered:

  • Changes to State read in the last run
  • Only the reading scopes re-run
  • Unchanged children are skipped
  • Three phases: composition, layout, draw

Deep dive

Compose has three phases: composition (what to show), layout (where), drawing (how). A state read in a later phase only re-runs that phase.

Recomposition is optimistic and can be cancelled and restarted if state changes again mid-way.

A composable may recompose many times per second during animation, so avoid allocation and heavy work in bodies.

Layout Inspector shows recomposition and skip counts per composable.

Common mistakes

  • Saying you trigger recomposition by calling a function.
  • Assuming the order or number of recompositions is fixed.
  • Reading state high in the tree, which widens the area that recomposes.

Senior take & follow-ups

The key phrase is 'state read tracking'. Then mention phases and skipping.

Follow-up questions

Think of your answer first, then open the hint.

  1. How do you see what recomposes?

    Show hint

    Layout Inspector's recomposition counts, or composition tracing in a Perfetto trace.

  2. What's a recompose scope?

    Show hint

    The smallest restartable function that read the state.

Related questions

Suggest a fix if something here is wrong or out of date.