A modern programming language that makes developers happier.

kotlinlang

I have a `LazyColumnFor` that displays 20 items. The items consist of an image and some text. When displaying 20 items with each image of size 128kb, it lags like hell. Is this a bug or am I missing something? Also, it works totally fine when displaying only text.

Maybe you're using `imageResource` that is a synchronous method to retrieve the image. Try again using an image loading library like coil (search for Accompanist on Github)

Works fine for smaller images now but the 128kb ones are still lagging a bit. Although not that much compared to the `Image` composable

```CoilImageWithCrossfade(
    data = R.drawable.kakashi,
    modifier = Modifier
        .width(60.dp)
        .aspectRatio(1f)
        .clip(CircleShape),
    contentScale = ContentScale.Crop
)```
Yeah I guess the `Image` is lagging because I was using `imageResource` . The image I'm using: <https://i.pinimg.com/originals/2a/1c/5b/2a1c5bbb55d56e983ff7ba2b09caa556.jpg>

Do I have to manually resize the image? I use Glide and it takes care of everything but maybe Coil is different?

I feel like I've had just 20 items of text and it has lagged for me. Not crazy bad, but lags worse than a RecyclerView. I know they said there are still optimizations coming for it.

For me, it all works smooth until I add images

Screenshot_20200915-154142.jpg

Yeah, the performances of the lazycolumn are significantly lower than the recyclerview. Check the hwui bars on the bottom of my sample app in debug mode after a scroll.

<https://developer.android.com/topic/performance/rendering/inspect-gpu-rendering|https://developer.android.com/topic/performance/rendering/inspect-gpu-rendering> :smiley:

I too just started using a LazyColumnFor, where each item is a ‘card’ with column, text, icon. And it is super chunky and slow. From setting a breakpoint, it seems to me that everything is getting drawn again on a scroll, which is not yet optimal…

are you guys loading the image asynchronously?

What I found about `LazyFor` is that it doesn't really work well with dynamic height rows. This is also mentioned in the docs somewhere but I can't remember the exact place right now. So, be careful about changing height of the views according to a state change or request completion.

hey. I am currently working on fixing how we handle the items size changes. so it will be fixed in one of the next releases hopefully

regarding the performance, yes, we are going to explore it more and find ways to fix it. first thing you should do is to not load the images on ui thread. please use `loadImageResource` instead of `imageResource`. if after that the scroll is still laggy please file a bug with the sample app. it will help us debug! thanks

Why not prevent `imageResource` from being used at all if it can introduce UI performance issues?

I don't have a huge list so I fixed it by not using lazycolumnfor right now and instead fill it via items.foreach {}. I also had issues with scrolling when items are clickable when using lazycolumnfor.