Inside Jetpack Compose diagram

If you find any problems, please create an issue.

For more information, see the "Inside Jetpack Compose" article.

https://medium.com/@takahirom/inside-jetpack-compose-2e971675e55e

This diagram illustrates how Jetpack Compose handles changing the state of the following code.

The entire code is here.

@Composable
fun Content() {
    var state by remember { mutableStateOf(true) }
    LaunchedEffect(Unit) {
        delay(3000)
        state = false
    }
    if (state) {
        Node1()
    }
    Node2()
}
RootNode
├── Node1(value=node1)
└── Node2(value=node2)

RootNode
└── Node2(value=node2)

diagram