Only render ~20 most recent messages

[reichert621]

(Note: the code for this lives in the https://github.com/papercups-io/chat-window repo)

Only load the remaining messages if the customer scrolls up.

The problem we're trying to solve is that when too many messages are rendered, it slows down the animation of new messages being displays. So my thinking is that even if we have 100 messages in this.state.messages, we don't need to render them all.

Open to other solutions as well!

[pandurijal]

Hello, I am interested to pick this issue, but could you specify on which file those messages are rendered?

[reichert621]

hey @pandurijal! this might be a bit tricky to tackle, but if you're willing to give it a shot the code lives in the https://github.com/papercups-io/chat-window repo in this component: https://github.com/papercups-io/chat-window/blob/master/components/ChatWindow.tsx#L691

here are some instructions for getting setup for development: https://github.com/papercups-io/chat-widget#development

but let me know if you need any help or have any questions!