-
Notifications
You must be signed in to change notification settings - Fork 59.3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
关于messages重复渲染的问题 #5837
Comments
Title: About the problem of repeated rendering of messages |
这里是一个列表渲染的逻辑,前端框架针对列表渲染的时候,确实不好做diff 可以的优化方向是将最新的一条消息作为currentMessage提出来单独渲染,剩下的messages整体渲染。 |
Here is a list rendering logic. When the front-end framework renders the list, it is really difficult to do diff. The possible optimization direction is to present the latest message as currentMessage and render it separately, and render the remaining messages as a whole. |
目前我已经抽离出一个message-item的组件 |
At present, I have extracted a message-item component |
🥰 需求描述
I have verified this project, and when there are many conversations and chats, the browser will get stuck and the memory will skyrocket. After checking the general reasons, I found that it is because all Message-items on the page will be rendered repeatedly when returning from each Q&A. I added console.log() to message.map, and found that message-item would be repeatedly rendered about 10 times when entering the page for the first time. When text stream was output, message-item would be repeatedly rendered and the number of rendering times was the length of text stream.
When there are 20-40 chats in a session or when the length of each text stream is much longer, the whole system freezes.
🧐 解决方案
Do not over-render, update only the corresponding message-item each time the text stream returns, and do not render the other message-items repeatedly
📝 补充信息
No response
The text was updated successfully, but these errors were encountered: