Hello everyone! I have an issue with my LazyColumn...

# compose

[Daniel Okanin]

Hello everyone!
I have an issue with my LazyColumn. Im trying to display a list of notifications items but the list is so slow and laggy.
I wrap my modal with stable annotation (see the NotificationViewModelItem below), but still have a state field inside. I figure out that when I set my Lazy Column under a Scaffold the list isn’t laggy anymore. Is it related? maybe is related to the SubcomposeLayout inner view that exists there?
Thanks

[Daniel Okanin]

@Stable
data class NotificationViewModelItem(
    val title: String ?,
    val body: String ?,
    val imageDescriptor: ImageDescriptor?,
    var isViewed : MutableState<Boolean>,
    val type: Int = 0,
    val timeStamp : Long
)

[Daniel Okanin]

val scrollState: LazyListState = rememberLazyListState()
LazyColumn(
    state = scrollState,
    modifier = Modifier
        .fillMaxSize()
        .padding(
            start = 16.dp, end = 16.dp
        )

) {
    itemsIndexed(entries){index: Int, item->
        NotificationCard(item, index, onItemClicked)

    }
}

[Daniel Okanin]

@Composable
fun NotificationCard(
    item: NotificationViewModelItem,
    index: Int,
    onItemClicked: OnItemClicked<NotificationViewModelItem>? = null
) {

    Row(
        modifier = Modifier
            .fillMaxWidth()
            .height(100.dp)
            .clickable(
                onClick = {
                    onItemClicked?.onItemClicked(item, index)
                },
                indication = rememberRipple(),
                interactionSource = remember { MutableInteractionSource() }
            ),
        verticalAlignment = Alignment.CenterVertically,
    ) {
        HzImage(
            imageDescriptor = null,
            placeHolder = defaultPlaceholder(),
            emptyHolder = painterResource(
                id = getEmptyDrawable(Notification().apply { Type = item.type })
            ),
            modifier = Modifier
                .size(60.dp)
                .clip(CircleShape),
            contentScale = if (item.imageDescriptor != null && item.imageDescriptor.hasWhiteBg()) ContentScale.Fit else ContentScale.Crop,
        )
        Spacer(Modifier.size(10.dp))
        Column(
            modifier = Modifier.weight(1f),
        ) {
            if (!item.title.isNullOrEmpty()) {
                Text(
                    modifier = Modifier.fillMaxWidth(),
                    text = item.title ?: "",
                    color = Color.Black,
                    maxLines = 1,
                    overflow = TextOverflow.Ellipsis
                )
            }
            Text(
                modifier = Modifier.fillMaxWidth(),
                text = item.body ?: "",
                color = Color.Black,
                maxLines = 3,
                overflow = TextOverflow.Ellipsis
            )
            Text(
                modifier = Modifier.fillMaxWidth(),
                text = AndroidCore.services().stringFormatter().formatDateForNotifications(item.timeStamp),
                color = Color.Black,
                overflow = TextOverflow.Ellipsis
            )
        }

        ViewedIndicator(item.isViewed.value)
    }
}

@Composable
fun ViewedIndicator(isViewed: Boolean) {
    Box(
        modifier = Modifier
            .size(14.dp)
            .background(color = HouzzTheme.colors.accentDefault.copy(alpha = if (!isViewed) 1f else 0f), shape = CircleShape)
    )

}

[FunkyMuse]

Test the performance in release variant not in debug

About the other thing if it really does fix the problem file an issue

[Daniel Okanin]

thanks @FunkyMuse! But do you know why the Scaffold fix this issue in debug?

[galex]

@FunkyMuse How come we can't have good performance in debug? What causes Compose to recompose more than necessary in debug?

[Andrey Kulikov]

If wrapping it into Scaffold really fixes the issue for you could you please file a bug with the code you use, thanks

[Mor Amit]

@galex we didn’t see more recompositions in debug, and yet the performance was much better on release.
@Andrey Kulikov @FunkyMuse do you know why might cause this issue? is there a way to improve the performance in debug?

[FunkyMuse]

Compose's performance in debug is a known issue, just test a release version

[galex]

Maybe @Chris Sinco [G] or @Adam Powell might have an idea why this happens? 🤔

[Adam Powell]

many. 🙂 Everything from additional codegen to support things like live literals added in debug mode to ART running heavily reduced optimizations for debuggable apps to r8 applying quite a bit of optimization as well

[galex]

@Adam Powell oh I see, thanks for your input 🙂

[Mor Amit]

Thanks @Adam Powell!

[Daniel Okanin]

Thanks 🙏 @Adam Powell