0

I decided to update my project to stable Compose 1.4.0 because of some new fixes, but quickly found out that all of my LazyLists with clickable cards have become very laggy while scrolling. I make my cards clickable by just adding an onClick parameter.

Here some example code with laggy LazyList:

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            LazyListTestTheme {
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    MainContent()
                }
            }
        }
    }
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun MainContent() {
    Scaffold(
        topBar = {
            LargeTopAppBar(
                title = {
                    Text(text = "Test app")
                }
            )
        },
        content = {
            LazyColumn(
                contentPadding = it
            ){
                items(
                    count = 32,
                    itemContent = { index ->
                        CustomCard(text = index.toString())
                    }
                )
            }
        }
    )
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun CustomCard(
    text: String
) {
    Card(
        modifier = Modifier
            .fillMaxWidth()
            .height(128.dp)
            .padding(16.dp, 4.dp),
        onClick = {

        }
    ) {
        Text(

            text = text
        )
    }
}

I tested it on Compose 1.2.0 and 1.3.2 release and then updated to 1.4.0. Compose 1.2.0 and 1.3.2 seems to work fine, while LazyList scrolling on 1.4.0 is laggy, but only with clickable elements. What can I do about it? Is it a new Compose bug or am I doing something wrong?

prax19
  • 1
  • 2
  • Have you checked FrameTimingMetric via Macrobenchmark to compare the versions (https://developer.android.com/topic/performance/benchmarking/macrobenchmark-metrics#frame-timing)? If anything, I'd expect the improvements to focus-related Modifiers to improve the speed of clickable content in 1.4 over 1.2/1.3.2, so it'd be good to know if this is worse at a particular percentile or across the board. – Ian G. Clifton Mar 27 '23 at 17:35

1 Answers1

0

Try using the modifier for clickable as the card's onClick was experimental

    Card(
        modifier = Modifier
            .clickable(onClick = { onClickCard() })
...

If there's no change, then try temporarily pulling the list out of the scaffold to see if that's a factor.

moken
  • 3,227
  • 8
  • 13
  • 23
k88albr
  • 1
  • 2