From 17b4985632b6cca9ccebcf86326793f994ab1831 Mon Sep 17 00:00:00 2001 From: John Smith Date: Sun, 6 Aug 2023 13:50:27 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E6=B6=88=E6=81=AF=E5=B9=B3?= =?UTF-8?q?=E6=BB=91=E7=AE=97=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- frontend/src/api/chat/ChatClientTest.js | 71 +++++++++++++++---- .../src/components/ChatRenderer/index.vue | 10 ++- 2 files changed, 63 insertions(+), 18 deletions(-) diff --git a/frontend/src/api/chat/ChatClientTest.js b/frontend/src/api/chat/ChatClientTest.js index 8fa668d..49f337c 100644 --- a/frontend/src/api/chat/ChatClientTest.js +++ b/frontend/src/api/chat/ChatClientTest.js @@ -3,20 +3,57 @@ import * as constants from '@/components/ChatRenderer/constants' import * as avatar from './avatar' const NAMES = [ - 'xfgryujk', 'Simon', 'Il Harper', 'Kinori', 'shugen', 'yuyuyzl', '3Shain', '光羊', '黑炎', 'Misty', '孤梦星影', - 'ジョナサン・ジョースター', 'ジョセフ・ジョースター', 'ディオ・ブランドー', '空條承太郎', '博丽灵梦', '雾雨魔理沙', - 'Rick Astley' + '光羊', + '黑炎', + '孤梦星影', + '博丽灵梦', + '雾雨魔理沙', + '空條承太郎', + 'ディオ・ブランドー', + 'ジョセフ・ジョースター', + 'ジョナサン・ジョースター', + 'Simon', + 'Misty', + 'Kinori', + 'shugen', + '3Shain', + 'yuyuyzl', + 'xfgryujk', + 'Il Harper', + 'Rick Astley', ] const CONTENTS = [ - '草', 'kksk', '8888888888', '888888888888888888888888888888', '老板大气,老板身体健康', - 'The quick brown fox jumps over the lazy dog', "I can eat glass, it doesn't hurt me", - '我不做人了,JOJO', '無駄無駄無駄無駄無駄無駄無駄無駄', '欧啦欧啦欧啦欧啦欧啦欧啦欧啦欧啦', '逃げるんだよォ!', - '嚯,朝我走过来了吗,没有选择逃跑而是主动接近我么', '不要停下来啊', '已经没有什么好怕的了', - 'I am the bone of my sword. Steel is my body, and fire is my blood.', '言いたいことがあるんだよ!', - '我忘不掉夏小姐了。如果不是知道了夏小姐,说不定我已经对这个世界没有留恋了', '迷えば、敗れる', - 'Farewell, ashen one. May the flame guide thee', '竜神の剣を喰らえ!', '竜が我が敌を喰らう!', - '有一说一,这件事大家懂的都懂,不懂的,说了你也不明白,不如不说', '让我看看', '我柜子动了,我不玩了' + '草', + '让我看看', + '不要停下来啊', + '我不做人了,JOJO', + '已经没有什么好怕的了', + '我柜子动了,我不玩了', + '老板大气,老板身体健康', + '我醉提酒游寒山,爽滑慢舔', + '無駄無駄無駄無駄無駄無駄無駄無駄', + '欧啦欧啦欧啦欧啦欧啦欧啦欧啦欧啦', + '所有没好全部康复呀,我的癌也全部康复呀', + '嚯,朝我走过来了吗,没有选择逃跑而是主动接近我么', + '有一说一,这件事大家懂的都懂,不懂的,说了你也不明白,不如不说', + '如来来了吗?如来嘛~他真来了吗?如~来~到底来没来?如来~如来他真来了吗?如来~你看看,来没来?如~来~', + '迷えば、敗れる', + '逃げるんだよォ!', + '竜神の剣を喰らえ!', + '竜が我が敌を喰らう!', + '言いたいことがあるんだよ!', + '知らず知らず隠してた 本当の声を響かせてよほら', + 'kksk', + '8888888888', + 'Never gonna give you up', + 'Never gonna let you down', + '888888888888888888888888888888', + 'I am the storm that is approaching', + "I can eat glass, it doesn't hurt me", + 'The quick brown fox jumps over the lazy dog', + 'Farewell, ashen one. May the flame guide thee', + 'I am the bone of my sword. Steel is my body, and fire is my blood.', ] const EMOTICONS = [ @@ -194,9 +231,6 @@ function randInt(min, max) { export default class ChatClientTest { constructor() { - this.minSleepTime = 800 - this.maxSleepTime = 1200 - this.onAddText = null this.onAddGift = null this.onAddMember = null @@ -219,7 +253,14 @@ export default class ChatClientTest { } refreshTimer() { - this.timerId = window.setTimeout(this.onTimeout.bind(this), randInt(this.minSleepTime, this.maxSleepTime)) + // 模仿B站的消息间隔模式 + let sleepTime + if (randInt(0, 4) == 0) { + sleepTime = randInt(1000, 2000) + } else { + sleepTime = randInt(0, 400) + } + this.timerId = window.setTimeout(this.onTimeout.bind(this), sleepTime) } onTimeout() { diff --git a/frontend/src/components/ChatRenderer/index.vue b/frontend/src/components/ChatRenderer/index.vue index 811004f..65fab5f 100644 --- a/frontend/src/components/ChatRenderer/index.vue +++ b/frontend/src/components/ChatRenderer/index.vue @@ -264,15 +264,19 @@ export default { } else { let curTime = new Date() let interval = curTime - this.lastEnqueueTime - // 让发消息速度变化不要太频繁 - if (interval > 1000) { + // 真实的进队列时间间隔模式大概是这样:2500, 300, 300, 300, 2500, 300, ... + // B站消息有缓冲,会一次发多条消息。这里把波峰视为发送了一次真实的WS消息,所以要过滤掉间隔太小的 + if (interval > 1000 || this.enqueueIntervals.length < 5) { this.enqueueIntervals.push(interval) if (this.enqueueIntervals.length > 5) { this.enqueueIntervals.splice(0, this.enqueueIntervals.length - 5) } + // 这边估计得尽量大,只要不太早把消息缓冲发完就是平滑的。有MESSAGE_MAX_INTERVAL保底,不会让消息延迟太大 + // 其实可以用单调队列求最大值,偷懒不写了 this.estimatedEnqueueInterval = Math.max(...this.enqueueIntervals) - this.lastEnqueueTime = curTime } + // 上次入队时间还是要设置,否则会太早把消息缓冲发完,然后较长时间没有新消息 + this.lastEnqueueTime = curTime } // 把messages分成messageGroup,每个组里最多有1个需要平滑的消息