[Performance] [Audit]: messages with `Views` nested in `Text` for inline code are 700% slower to render on Android

[jsamr]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

This report is part of #3957, scenario "Rendering Individual chat messages".

Flamegraph

This flamegraph shows commit c153. The full commit log is available HERE to inspect in Flipper / React Devtools (you will have to unzip it first).

Commit c153 refers to one RenderHtml component with 20 words wrapped in inline code. Something like this:

`inline code spanning multiple lines inline code spanning multiple lines inline code spanning multiple lines inline code spanning multiple lines`

Its rendering time is 112ms (yellow bar in chart below). All other messages (green bars), including some messages with as many words are rendered between 8 to 14ms. So that's a minimal overhead of 112 / 14 = 8 or +700%.

Proposal: Review InlineCode

Review if the design requirements that have led to implementation of #2527 are worth the rendering cost. You might want to profile this on iOS also.

[MelvinBot]

Triggered auto assignment to @laurenreidexpensify (AutoAssignerTriage), see https://stackoverflow.com/c/expensify/questions/4749 for more details.

[marcaaron]

Interesting. I'm not sure if this is a mainline case that we need to prioritize for inline code blocks are kind of a power user feature. I think we are more generically concerned with the typical usage scenarios which is probably ... not using any markdown at all. But not too sure. Will let others share their thoughts on this.

700% sounds pretty bad but we can also test the performance here...

Benchmarking idea:

1. Create two chats. 1 with no inline comments and one with several multi line inline code comments.
2. Compare the time to switch between both on Android.

Does it take an excessive amount of time to render the chat with inline code blocks?