ChatGPT-Next-Web
ChatGPT-Next-Web copied to clipboard
[Bug] 超长消息列表性能优化
反馈须知
请在下方中括号内输入 x 来表示你已经知晓相关内容。
描述问题 请在此描述你遇到了什么问题。 我的聊天窗口才500个记录,在聊天窗口输入内容已经卡到无法忍受的地步了,我现在只能在文本文件中输入内容然后复制黏贴到聊天窗口 如何复现 请告诉我们你是通过什么操作触发的该问题。
截图 请在此提供控制台截图、屏幕截图或者服务端的 log 截图。
一些必要的信息
- 系统:[比如 windows 10/ macos 12/ linux / android 11 / ios 16]
- 浏览器: [比如 chrome, safari]
- 版本: [填写设置页面的版本号]
- 部署方式:[比如 vercel、docker 或者服务器部署]
新开一个聊天记录就行了,现在还没有对超长对话消息做性能优化。
在contos7 firefox 102.9.0esr (64 位)上 一个160对话的聊天输入框内就能感受到明显的卡顿,补全啥的都关闭了
+1,卡顿问题还是很明显,前面issue #680 #553 close相关的lazy load pr是因为效果问题被disable了吗?
我是用vercel一键部署的, 在windows11 edge浏览器上使用。 本地聊天框对话超过100 就会出现卡顿的现象了。 但是只有输入卡顿, 输出速度还是正常的。 希望能尽快优化这个问题。
输入卡顿是由于对话界面Chat function使用了多个useEffect()造成的,每次按键输入都会渲染整个聊天记录三次
这个pr确实有效修复了,感谢!
Hello, I have similar issue. Before updating, I had to open a new chat to normally use the app, because otherwise it'd lag too much. Now, opening a new chat doesn't really help, the whole app is really laggy now, whenever you or the bot types. It's so bad, it have crashed my whole system a couple of times, because of OOM. I'm on Poco F3 (8/256) with Android 12. My chrome version is 110, if it helps. Should I open a new issue, or it's fine here?
The lagging is caused by bubble preview and the input height calculation function:
useEffect(measure, [userInput]);
Every letter input will cause the whole page to re-render twice, and turning bubble previewing off only solves half of the issue.
https://github.com/Yidadaa/ChatGPT-Next-Web/assets/1525214/8c68ee56-1661-4ee1-b9d4-d8df2eb98cdc
The video is recorded with the latest commit <91cb7aa1>:
commit 91cb7aa13d24e98319d92f90c266cdb79b25dbe2 (HEAD, upstream/main)
Merge: b51f7f9 ab0f7cc
Author: Yifei Zhang <[email protected]>
Date: Thu Jul 13 16:46:00 2023 +0800
Merge pull request #2372 from Yidadaa/dependabot/npm_and_yarn/semver-6.3.1
chore(deps): bump semver from 6.3.0 to 6.3.1
@Happiness777 @Dakai
This issue should have been fixed by lazy loading. I am wondering what version of code are you using? @Happiness777
If your code is too old, you should upgrade it to latest.
And one more question, how many messages in your current laggy chat?
If your code is too old, you should upgrade it to latest.
I've cloned the latest commit recently, about 8 hours ago.
And one more question, how many messages in your current laggy chat?
Even when I just open a new chat, the first message is already laggy. I suppose the app doesn't stop rendering all these messages in my old chats for some reason. Or it does, but not completely. I have like 40-50 chats (with 30+ messages each).
This seems unusual and a bit strange. Will your chat messages be very long? How long is each message approximately? I haven't received similar feedback from my users yet.
Can you please upgrade your Chrome browser to the latest version and then try again to see if there are any issues?
How long is each message approximately?
They usually vary, but the longest of them may be more than 8k chars, sometimes. I'd say 1k on average, question + response.
Can you please upgrade your Chrome browser to the latest version and then try again to see if there are any issues?
Already did that, and still getting the same results. The thing is that I didn't have issues with the app before updating it, my version was quite old though, there were no masks and the UI was different.
I wanted to test this on another browser, where I could profile it, but chatting for so long is just not an option for me, at the moment.
Message length may be the point.
If you could modify your code:
-
change
twoScreenHeight
toconst twoScreenHeight = Math.max(500, parentBounds.height);
: https://github.com/Yidadaa/ChatGPT-Next-Web/blob/91cb7aa13d24e98319d92f90c266cdb79b25dbe2/app/components/markdown.tsx#L159 -
change this number to
1000
here: https://github.com/Yidadaa/ChatGPT-Next-Web/blob/91cb7aa13d24e98319d92f90c266cdb79b25dbe2/app/components/markdown.tsx#L177
Commit those changes and redeploy your project to make it take effects, and see what will happen.
If these methods improve the lagging situation, it suggests that rendering long messages on older devices may be a performance bottleneck, and the DOM query operations used for lazy loading can also cause performance degradation. If these speculations are confirmed, I will submit a PR to correct them.
Commit those changes and redeploy your project to make it take effects, and see what will happen.
I did, and it doesn't seem to have any effect. By the way, I noticed that even dragging some sliders (memory limit, temperature, etc.) is making the whole app lag.
If these methods improve the lagging situation, it suggests that rendering long messages on older devices may be a performance bottleneck
And did you just say that my phone is old? :D
And did you just say that my phone is old? :D
I apologize if I have offended you🤣. The Snapdragon 870 has decent performance, but it can be considered as a mid-range SoC from the previous generation.
Thank you very much for your feedback. If possible, please create a new issue and provide information such as your mobile phone model, operating system version, browser version, and code commit hash. I will further investigate this issue.
Nah, I wasn't offended, it just sounded funny. SD870 is still pretty good, and I don't think it's anywhere near mid-range SoC, yes, it's a few generations behind now, but is still kinda flagship.
Anyway, I'm going to create a new issue later, I think, because I'm going to sleep soon. Or not ¯\(ツ)/¯ We'll see.
Good night bro, give yourself a recharge and don't let your battery run low :).
Thank you :3
please create a new issue
Hello, can you please look into my issue (#2393)? I've posted some updates about it yesterday.
@Happiness777 in plan, i will fix it.