Laggy Lazy Column Android Compose

Question

I've created a whole app in Jetpack Compose . However, the performances on the Lazy Column are pretty bad and it does not make any sense. Lazy Column should be the substitution of RecyclerView , but RecyclerView works much better at the moment.

I made a Lazy Column with headers and Lazy Rows as items (basically a nested list). As you can see there are images but I used the Coil library so everything should be loaded in a separate thread. I've already seen these discussions: link1 , link2 . But it seems like there's not a solution to this problem, even though now Jetpack Compose is stable.

Did any of you find a way to get better performances or should I substitute this Lazy Rows with a RecyclerView ?

Here's a screen of the page:

Answer 1

Things will speed up your Lazy List

1. If you're in debug mode, that's normal . Don't worry if your app is laggy in debugging. It's completely fine. Just create the APK in release mode (Build -> Generated Signed Bundle/APK), which might solve your problem. This happens because when in debugging, Compose translates bytecode in runtime using JIT.
2. Set a key for your item . Initialize your Lazy list like this.

LazyColumn() {
    items(
        count = cartItems.size,
        key = {
            cartItems[it].cartItem.id
        },
        itemContent = { index ->
            val cartItemData = cartItems[index]
            CartItemWithActions(data = cartItemData)
            Divider(
                color = colorResource(id =R.color.separator_line)
            )
        }
    )
}

Setting a key works similar to the DiffUtil class in RecyclerView . Check the Maciej Przybylski's post .

3. Make sure you don't have a variable that doesn't use the remember{} block.

@Composable
fun MyComposable() {
    ...
    val wrongList = myViewModel.getList() <- Don't do this
    val correctList = remember { myViewModel.getList() } <- Do this
    ...
}

Of course, the list should be a State so that you can observe if it changes. Without using remember every time the list recomposes, the myViewModel.getList() will be called.

4. You can also use contentType , which defines the type of object in a list. This is useful if you have headers or different types of objects in your list. Learn more here .

Check these resources never to have performance issues again. I highly suggest watching these videos: Optimizing Render Performance of Jetpack Compose , Performance best practices for Jetpack Compose , and reading this post .

Original Answer

SOLVED! Reading this reddit I found out the problem is only in the debug version . It seems crazy but it's true. That's because debug versions of Compose apps have a lot going on under the hood which impacts performance (pretty similar to what happens with Flutter). To solve the problem the only thing you need to do is to create a release version of your app. To do that, go to Build -> Generated Signed Bundle/APK . Create the key and then select release .

Enjoy your smooth app!