Odd behavior when in LazyColumn

[ursusursus]

Hi, I'm working a Chat UI (a list of messages), where each message might contain markdown formatting.
For the row item I simply use

@Composable
un AgentMarkdownItemRow(
    modifier: Modifier = Modifier,
    item: AgentMarkdownItem,
    onLongPress: (Item) -> Unit
) {
    AgentItemRow(
        modifier = modifier,
        timestamp = item.timestamp,
        onLongPress = {
            onLongPress(item)
        }
    ) {
        RichTextThemeProvider( <------------
            textStyleProvider = { MaterialTheme.typography.subheadline }
        ) {
            BasicRichText {
                Markdown(item.value)
            }
        }
    }
}

but then the LazyColumn then behaves weirdly, when scrolling items appear to change height, also when flinging the list won't go all the way to the end (but will if I scroll) etc.

Is this a known issue?

[enginegl]

+1, I noticed the same issue playing around this library.
It is easily reproduced with the markdown example from the sample with a few more list items added.

[ursusursus]

I wonder how does chatgpt depend on this lib if this is so obviously broken :/

[klaymen111]

I encountered the same issue while developing a chat with markdown support. The problem occurs when flinging to the end of a lazyColumn

[klaymen111]

I found a solution to the problem. You need to manually cache the parser instance and the parsing result. Then everything will work smoothly

val parser = remember { CommonmarkAstNodeParser() }

    val astNode = remember(parser, markdown) {
        parser.parse(markdown)
    }

    RichText(
        modifier = modifier,
        style = richTextStyle
    ) {
        BasicMarkdown(astNode)
    }

[ursusursus]

I found a solution to the problem. You need to manually cache the parser instance and the parsing result. Then everything will work smoothly

val parser = remember { CommonmarkAstNodeParser() }

    val astNode = remember(parser, markdown) {
        parser.parse(markdown)
    }

    RichText(
        modifier = modifier,
        style = richTextStyle
    ) {
        BasicMarkdown(astNode)
    }

What's the scope of parser? Per item or per screen?

[klaymen111]

In my case, the parser has a per-item scope, and that has already proven sufficient for smooth operation. You could make the parser's scope per-screen and provide it via composition local, which might offer an additional performance boost.