IssueTracker

Jetpack Compose version: 1.3.0-beta01 Jetpack Compose component used: derivedStateOf Android Studio Build: Chipmunk Kotlin version: 1.7.10

From the documentation of derivedStateOf, it says The result of calculation will be cached in such a way that calling [State.value] repeatedly will not cause[calculation] to be executed multiple times. This was true prior in Compose 1.2.0, but no longer is.

Here is sample code to reproduce the issue:

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            // A surface container using the 'background' color from the theme
            Surface(
                modifier = Modifier.fillMaxSize(),
                color = MaterialTheme.colors.background
            ) {
                OuterComposable()
            }
        }
    }
}

@Suppress("EqualsOrHashCode")
class ZeroMap(
    val zeroMap: Map<Int, Boolean>
) {
    override fun equals(other: Any?): Boolean {
        if (this === other) {
            Log.e("StateTest", "ZeroMap is the same reference")
            return true
        }
        if (javaClass != other?.javaClass) {
            Log.e("StateTest", "ZeroMap is not the same because of javaClass")
            return false
        }

        other as ZeroMap

        if (zeroMap.size != other.zeroMap.size) {
            Log.e("StateTest", "ZeroMap is not the same because trackLayouts.size (${zeroMap.size}) != other.trackLayouts.size (${other.zeroMap.size})")
            return false
        }

        val otherEntries = other.zeroMap.entries
        zeroMap.entries.forEachIndexed { index, entry ->
            val otherEntry = otherEntries.elementAt(index)
            if (entry.value != otherEntry.value) {
                Log.e("StateTest", "ZeroMap is not the same because entry.value (${entry.value}) != otherEntry.value (${otherEntry.value}) for index $index")
                return false
            }
        }

        Log.e("StateTest", "ZeroMap is the same value")
        return true
    }
}

class ZeroStateProvider(
    val scrollState: LazyListState,
    private val zeroState: State<ZeroMap>
) {
    fun isAtZero(index: Int) = zeroState.value.zeroMap[index]
}

@Composable
fun rememberZeroStateProvider(): ZeroStateProvider {
    val scrollState = rememberLazyListState()
    val zeroState = remember {
        derivedStateOf(structuralEqualityPolicy()) {
            Log.e("StateTest", "calculating zero state for scroll offset: ${scrollState.firstVisibleItemScrollOffset}")
            val zeroMap = mutableMapOf<Int, Boolean>()
            scrollState.layoutInfo.visibleItemsInfo.forEach {
                zeroMap[it.index] = it.offset == 0
            }
            ZeroMap(zeroMap)
        }
    }
    return remember {
        ZeroStateProvider(scrollState, zeroState)
    }
}

@Composable
fun OuterComposable(
    modifier: Modifier = Modifier,
) {
    Log.e("StateTest", "Composing OuterComposable")
    val zeroStateProvider = rememberZeroStateProvider()
    LazyRow(
        state = zeroStateProvider.scrollState,
        horizontalArrangement = Arrangement.spacedBy(60.dp),
        verticalAlignment = Alignment.Top,
        modifier = modifier
            .fillMaxWidth()
    ) {
        items(
            count = 100,
        ) { index ->
            InnerComposable(index, zeroStateProvider)
        }
    }
}

@Composable
private fun InnerComposable(
    index: Int,
    zeroStateProvider: ZeroStateProvider,
    modifier: Modifier = Modifier
) {
    Log.e("StateTest", "Composing InnerComposable (index=$index)")
    val color by remember {
        derivedStateOf(structuralEqualityPolicy()) {
            Log.e("StateTest", "InnerComposable: calculating color")
            when (zeroStateProvider.isAtZero(index)) {
                true -> Color.Red
                false,
                null -> Color.Blue
            }
        }
    }

    Box(
        modifier = modifier
            .background(color)
            .size(200.dp)
    )
}

The output in Compose 1.2.0 gives:

E/StateTest: InnerComposable: calculating color
E/StateTest: calculating zero state for scroll offset: 1
E/StateTest: Composing InnerComposable (index=0)
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: Composing InnerComposable (index=4)
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: calculating zero state for scroll offset: 3
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: calculating zero state for scroll offset: 5
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: calculating zero state for scroll offset: 6
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color

and in Compose 1.3.0-beta01 gives:

E/StateTest: calculating zero state for scroll offset: 2
E/StateTest: ZeroMap is not the same because entry.value (false) != otherEntry.value (true) for index 0
E/StateTest: InnerComposable: calculating color
E/StateTest: calculating zero state for scroll offset: 2
E/StateTest: ZeroMap is not the same because entry.value (false) != otherEntry.value (true) for index 0
E/StateTest: Composing InnerComposable (index=0)
E/StateTest: calculating zero state for scroll offset: 2
E/StateTest: ZeroMap is not the same because entry.value (false) != otherEntry.value (true) for index 0
E/StateTest: InnerComposable: calculating color
E/StateTest: calculating zero state for scroll offset: 2
E/StateTest: ZeroMap is not the same because entry.value (false) != otherEntry.value (true) for index 0
E/StateTest: calculating zero state for scroll offset: 2
E/StateTest: ZeroMap is not the same because entry.value (false) != otherEntry.value (true) for index 0
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: InnerComposable: calculating color
E/StateTest: calculating zero state for scroll offset: 4
E/StateTest: ZeroMap is the same value
E/StateTest: calculating zero state for scroll offset: 5
E/StateTest: ZeroMap is the same value

As you can see from this output, in Compose 1.2.0, calculating zero state for scroll offset only appears once every time the scroll state changes (as expected), and then the inner compositions recalculate their color accordingly. But in Compose 1.3.0-beta01, calculating zero state for scroll offset shows up many times every time the scroll state changes. The number of times it runs increases with the number of composables that use its state.

I'm pretty sure this was caused by https://issuetracker.google.com/issues/230168389