28.从chrome消息队列谈unity3d的UI框架设计

2023-03-06 07:58:46 来源: 程序员客栈

1 缘起


(资料图片)

在UI架构圈,MVC是一个著名的小团伙,其中M是被偷窥重度成瘾者,不过我们一般称之为观察者,毕竟读书人的事,怎么能叫偷呢对吧。

M喜欢散播自己的花边小新闻,屁大点儿事,都会翻译成小道消息重大事件散播出去。VC则是俩狗仔,不管M出了啥事,总能第一时间闻到消息,摇旗呐喊。

这种玩法同时满足了M和狗仔们的大多数需求,因此很快在UI架构圈流行开来。去年我用unity3d设计过一版UI框架,也是基于MVC模式。

本来这样也挺好,M出自己的名,狗仔追自己的星。但M太秀了,有时候一股脑爆出一大波新闻,让狗仔们忙得应接不暇,有时候又波澜不惊,让狗仔们急得抓耳挠腮。

MVC模式中,M抛出的事件默认都是同步处理的。这带来了一些问题:如果同一帧内收到并处理太多事件的话,可能由于处理时间太长,导致游戏卡顿。

2 取经

最近的学习研究chrome浏览器的一些架构设计,发现跟unity3d游戏设计有一些相似相溶的地方,随手做了一番对比:

Unity3dChrome
消息队列消息队列
定时任务setTimeout(), 延迟队列
观察者MutationObserver
Task/CoroutinePromise
async/awaitasync/await
游戏渲染帧requestAnimationFrame()

早期的js对dom事件的支持并不友好,只能通过setTimeout()轮询处理。这种方式简单粗暴,但也有一些问题:如果轮询间隔时间过短,则大部分情况下CPU在空转;而如果轮询间隔时间过长,则dom事件会得不到及时响应。

2000年的时候js引入了Mutation Event,采用观察者模式,当dom发生变化时立刻触发相应事件。Mutation Event属于同步回调模式,解决了实时响应的问题,但也为页面展示带来了性能隐患。当我们使用js大量修改dom结构时,会频繁抛出事件,如果所有的dom事件都同步处理,势必会导致页面卡顿。

也因此,Mutation Event被反对使用,并逐渐从web标准事件中被移除。dom4之后推荐使用MutationObserver,其作出的改进其实主要就一点:把所有的dom事件统一放入到微任务消息队列中,在每一帧的结尾一次性触发。通过异步回调解决性能问题,通过微任务解决实时性问题。

3 消息队列

chrome中的异步任务体系都是基于消息队列完成的,包括dom事件、fetch网络请求、promise异步任务等等。

js中的异步任务还细分为了宏任务与微任务,其中只有MutationObserver 和promise是微任务,其它的像setTimeout()之类的都是宏任务。

宏任务由宿主(比如chrome中的window对象)维护,但js引擎需要有自己的异步任务体系,因此引入了微任务队列。

后端也有消息队列,比如Kafka、RocketMQ等,但与chrome把消息队列主要用于异步任务处理不同,后端消息队列最重要的作用主要有三:定序 (Ordering),分离式数据库 (Unbundling Database)、重放 (Replay)。以首字母可简记为:OUR。

我们在做unity3d框架设计的时候,其实也有大量使用消息队列用于处理异步任务。

比如处理网络协议:通常的做法是单独起一个网络线程,接收网络协议,并把它们放到消息队列中,然后由主线程按顺序异步处理这些网络协议。

再比如Coroutine库:可以把所有的协程对象按顺序放入到一个消息队列中,每一帧按顺序遍历它们,并调用它们的next()方法。

这中间还诞生过一个很有趣的技巧:放置于消息队列中的消息,往往对先后顺序有要求,但对处理时间并不敏感。如果发现当前帧已经占用了太长的时间,可以直接跳出当前帧处理过程,把剩余的消息推迟到下一帧去处理。即无需每一帧都清空当前消息队列,从而可以缓解游戏卡顿的问题。我把这个小技巧称为分帧。

4 缘落

但UI框架遇到的问题又略有不同。游戏中有很多非常复杂的UI,比如背包,在加载结束之后,需要按需初始化大量的控件。初始化控件的逻辑是游戏业务逻辑,而不是框架底层逻辑,因此很难完全封装在框架中。另外,初始化过程通常是在一帧内完成的,数量越多越有可能导致游戏卡顿。

针对这个问题,通用优化方案是将这些控件预先拖到一个MonoBehaviour脚本中,从而在加载的时候同步完成初始化过程。这个方案不是本文的重点,因此不再更多展开。另外,这个方案只能解决静态控件的初始化问题,对于背包这种需要根据服务器协议初始化大量动态控件的复杂UI起不到优化效果。

基于前述消息队列和分帧的思想,再参考MonoBehaviour的Start()方法可以配置成协程,我这里提一个新的优化思路:把UI框架中用于控件初始化的OnLoaded()方法设计为协程,这样当遇到大量控件需要初始化的时候,可以支持分帧处理,从而缓解因为大量初始化动态控件导致的卡帧。

这个设计会带来一些新的问题,其中一个是:很多UI事件会有先后顺序要求,比如UI框架中的OnOpened()方法应该在OnLoaded()方法之后回调。但将OnLoaded()方法修改为协程后,就可能发生OnLoaded()方法未完全回调完成,就回调到了OnOpened()方法的情况。这需要进一步调整UI框架逻辑,以约束UI事件之间的先后顺序关系。

5 缘尽

相逢是缘,相知是福,再不关注,就真的缘尽了老板。

5 References

本文提到的UI框架位于unicorn库中,unicorn-examples示例代码

18 | 宏任务和微任务:不是所有任务都是一个待遇

标签: 网络协议 动态控件 轮询间隔

上一篇 :

下一篇 :

28.从chrome消息队列谈unity3d的UI框架设计

1缘起在UI架构圈,MVC是一个著名的小团伙,其中M是被偷窥重度成瘾者,不过我们一般称之为观察者,毕竟读...

03-06 07:58:46

环球热文:抖音十大结婚歌曲有哪些

1、《morethanwords》这首歌是Extreme在1990年发行的一首告白歌,不但旋律优美、曲风甜蜜,而且还能营造...

03-06 07:23:37

世界观速讯丨刀剑封魔录宝石合成表大全_刀剑封魔录宝石合成表

1、看看我这个,还有些宝石没研究出来,有谁研究出来了在加上点谢谢,外传的这游戏,主要体现在连招上,...

03-06 02:09:09

2021年什么时候入伏第一天 几号入伏 焦点热门

2021年什么时候入伏第一天2021年7月11日入伏。每年“三伏”大概在公历7月中旬至8月中旬之间,具体到今年...

03-05 23:48:10

今日关注:张则谦:3.5黄金原油走势分析,黄金周线收阳下周还会涨吗?

张则谦:3 5黄金原油走势分析,黄金周线收阳下周还会涨吗?,k线,黄金周,张则谦,黄金原油

03-05 21:06:58

天天要闻:考研日期一般是什么时候

一般是每年12月22,23号。考研,即参加硕士研究生入学考试。其英文表述是考研首先要符合国家标准,其次...

03-05 20:13:36

报道:@临沂人 收到这类「医疗保险」诈骗短信,千万不要点!

近期,有不法分子向参保人员发送诈骗短信诱导用户点击钓鱼链接,从而窃取参保人员个人信息进一步骗取财...

03-05 17:53:00

外观设计专利是15年还是10年_外观设计专利

1、当然可以。2、外观设计,是指对产品的形状、图案或者其结合以及色彩与形状、图案的结合所作出的富有...

03-05 17:18:56

环球时讯:魔兽世界60年代宏_魔兽世界60年代

你们好,最近小活发现有诸多的小伙伴们对于魔兽世界60年代宏,魔兽世界60年代这个问题都颇为感兴趣的,...

03-05 14:50:38

杜兰特大回环为什么这么有争议

造对方的防守犯规方式有很多,想LBJ或是鲨鱼那样天生神级破坏力除了犯规(好多时候犯规也没用)才能阻止...

03-05 13:58:16

“中国连续8年新能源汽车产销量世界第一”!李书福最新发声,他还提出了这些建议

3月4日,全国政协十四届一次会议首场“委员通道”集体采访活动在北京人民大会堂新闻发布厅举行。全国政...

03-05 10:45:31

热点在线丨“大家精要”丛书:《笛卡儿》

1、《“大家精要”丛书:《笛卡儿》》是陕西师范大学出版总社出版的图书,作者是周晓亮文章到此就分享结...

03-05 10:46:31

港科大允许学生使用ChatGPT!AI能加强教学,老师可自行决策|环球播资讯

港科大允许学生使用ChatGPT!AI能加强教学,老师可自行决策,教学,ai,教师,港科大,人工智能,chatgpt

03-05 08:57:37

1-[ 4,6-二甲基-5-嘧啶基羰基]-4-[_3S-4-[_1R-2-甲氧基-1-[4- 三氟甲基苯基]乙基]-3-甲基-1-哌嗪基]-4-

1、1-[(4,6-二甲基-5-嘧啶基)羰基]-4-[(3S)-4-[(1R)-2-甲氧基-1-[4-(三氟甲基)苯

03-04 23:08:06

外交部发言人:美国才是世界最大的核威胁来源

新华社北京3月3日电(记者温馨、董雪)外交部发言人毛宁3日表示,美方反复炒作“中国核威胁论”,不过是...

03-04 22:39:13

观点:中欧班列(沈阳)集结中心班列首发

证券时报e公司讯,“中欧班列(沈阳)集结中心班列首发仪式”4日在沈阳蒲河物流基地举办。此次中欧班列(沈...

03-04 15:39:40

每日热门:骛与鹜的区别组词_鹜与骛的区别

1、婺wù星名。2、即婺女,二十八宿之一,玄武七宿的第三宿[wu,nameofastar]婺,婺女,星名。3、-

03-04 13:28:41

英飞特2022年实现总营收15.13亿元 同比增长6.86% 天天快报

英飞特2022年实现总营收15 13亿元,同比增长6 86%;实现归母净利润2 04亿元,同比增长12 02%。

03-04 11:27:46

美联储发布半年度报告 强调坚定致力于将通胀率降至2% 世界快播报

中新社纽约3月3日电美国联邦储备委员会3日发布半年度《货币政策报告》(以下简称“报告”),强调坚定致...

03-04 11:01:38

全球焦点!长春身份证补办指南

办理条件居民身份证丢失,申请补领的公民。办理材料居民户口簿(原件)注:未满16周岁的,提供监护人的居...

03-02 16:15:29

淋漓尽致是什么意思 百度网盘_淋漓尽致是什么意思

1、1、成语淋漓尽致的意思是,形容说话或者写文章表达的非常的透彻充分,也可以形容一件事情非常的痛快...

03-02 15:48:21

观速讯丨河南禹州一酒店发生刑案致1人死亡,犯罪嫌疑人已被抓获

【河南一酒店发生刑案致1人死亡】河南禹州一酒店发生刑事案件致一人死亡犯罪嫌疑人已被抓获

03-02 11:14:17

全球报道:厨余垃圾有哪些_说一说厨余垃圾有哪些的简介

夏弥来为大家解答以下的问题,厨余垃圾有哪些,说一说厨余垃圾有哪些的简介,现在让我们一起来看看吧!1...

03-02 06:58:54

毫克和克的换算关系_克与毫克的换算关系 当前快报

1、1、呵呵这个容易,答案就是一克等于一千毫克!本题就是一个简单的不同单位之间的换算问题,这里需要...

03-02 04:22:00

3月1日基金净值:易方达远见成长混合A最新净值1.1504,涨2.04%_全球资讯

3月1日,易方达远见成长混合A最新单位净值为1 1504元,累计净值为1 1504元,较前一交易日上涨2 04%。...

03-02 01:35:58

绝笔诗_绝笔|天天快消息

1、简单的说就是最后一次写东西给某某词目:绝笔拼音:juébǐ解释:①【名】死前最后所写的文字或所作...

03-01 22:08:49

冷酸灵,不再是“原厂”?

“冷热酸甜,想吃就吃”。凭借这句广告词,冷酸灵给不少消费者留下深刻的记忆,但是如今的冷酸灵可能不...

03-01 19:46:36

速讯:怎么看平板短信验证码是多少_短信验证码是多少

1、1、信息啊,不管你用手机办理什么业务,只要涉及验证码这一块,都可以通过信息查找对方发过来的验证...

03-01 18:59:20

哈伊杜克U19在欧青联1/8比赛中2比1击败曼城...

哈伊杜克U19在欧青联1 8比赛中2比1击败曼城U19,第24分钟,哈伊杜克U19边锋布拉伊科维奇利用对方门将出...

03-01 17:16:32

天天热头条丨中国高校数量很多但本科教育薄弱,学生可以混文凭,开想出人才难度太大。

【本文来自《又一所“省会大学”,呼之欲出?》评论区,标题为小编添加】yuanhong现有的大学不够用吗台...

03-01 15:56:09

人民币对台币汇率走势(2023年3月1日)

金投外汇网(http: forex cngold org)提供了人民币对台币汇率走势(2023年3月1日):人民币对台币汇率...

03-01 13:31:09

五年级动物说明文作文500字大全猫-天天观点

1、有机会让爸爸妈妈带你去动物园,认真观察don动物的习性,你就会写了人类忠实的朋友——狗狗是人类早...

03-01 13:24:25

2023年4月汕头自考注意事项-每日速递

【注意事项】➊考生须在考前10天内登录广东省自学考试管理系统打印准考证。准考证用普通A4纸打印,严禁...

03-01 11:23:24

森赫股份:截至2023年2月28日,公司股东人数为14,401人 全球观热点

森赫股份(301056)03月01日在投资者关系平台上答复了投资者关心的问题。

03-01 09:42:42

EQ健康宝贝

1、EQ健康宝贝,本书从“做父母需要艺术”角度阐述家长应如何抓住关键期,做好情商启蒙,给孩子的成功人...

03-01 07:49:26

焦点关注:“轨道上的大湾区”跑出“加速度”

“未来已来·高质量发展看中国”系列报道:“轨道上的大湾区”跑出“加速度”人民网记者田兴春孙博洋2月...

03-01 07:12:55

热继电器型号规格全解_热继电器型号

1、热继电器的型号有:NR2热继电器NR2-11 5 Z0 1-13A、NR2热继电器NR2-25G Z0 1

03-01 01:57:46

鬼影重重魔腾背景故事_鬼影重重魔腾

1、99块钱现在没得买了。本文就为大家分享到这里,希望小伙伴们会喜欢。

02-28 22:46:35

大脖子病和甲亢的区别是什么_大脖子病和甲亢的区别_环球视点

1、span大脖子病和甲亢的区别有哪些?单纯性甲状腺肿俗称“粗脖子”、“大脖子”或“瘿脖子”。2、是以...

02-28 22:31:06

(规则类怪谈)金利中学

特别鸣谢@李富贵的李有钱(我同学)亲爱的同学,欢迎来到金利中学,您将在这里度过快乐且愉快的三年快乐...

02-28 20:06:56

2月28日工行纸黄金USD开盘价1813.98昨收价1813.98 国际黄金修复后下行 环球简讯

周二(2月28日),北京时间16:38,工行纸黄金USD现报1806 14美元 盎司,跌0 43%;工行纸黄金RMB现报403 13元 克,

02-28 17:42:57

1平方米等于多少平方分米_1平方米等于多少米|当前快播

1、1米×米=1平方米,米是长度单位,平方米是面积单位,他们描述的是不同的物质属性。2、没有1平米等于...

02-28 16:52:47

23内蒙古债02今日发布发行公告

23内蒙古债02发布发行公告

02-28 15:59:31

恒生科技指数午后跌超2%,哔哩哔哩跌近7% 环球新视野

2月28日下午,恒生科技指数午后跌超2%,科技股普遍走低,哔哩哔哩跌近7%,快手跌超4%,阿里巴巴跌约4%。

02-28 14:07:03

除颤仪的使用及维护_除颤仪的使用 天天快资讯

1、用干布迅速擦干患者胸部皮肤,将手控除颤电极板涂以专用导电胶,也可用盐水纱布,紧急时甚至可用清水...

02-28 11:39:00

每日聚焦:shotmaking

1、shotmaking,英语单词,主要作用为名词,作名词时译为“制鞋,修补皮鞋”。2、。文章到此就分享结束,希望对

02-28 11:16:24

抖音向超级APP一路“狂飙”,烧钱的外卖O2O真值得做吗?

图片来源@视觉中国文|靠谱的阿星,作者|自由哥伦布「风浪越大,鱼越贵」!高启强的这句经典台词是符合...

02-28 10:09:58

网红脸是什么脸型_网红脸是什么意思

1、大眼睛2、眼睛作为心灵的窗口,在五官中起着至关重要的作用,自然成为网络名人的首要元素。大眼睛已...

02-28 08:13:07

雪却输梅一段香的全诗的草书书法作品_雪却输梅一段香的全诗

1、梅须逊雪三分白,雪却输梅一段香的意思是梅花须逊让雪花三分晶莹洁白,雪花却输给了梅花的淡淡清香。...

02-28 06:06:11

你怎么舍得我难过尚雯婕完整版_你怎么舍得我难过 尚雯婕|天天速讯

1、云与海,最终信仰,木兰诗。2、候鸟,待我长发及腰,你怎么舍得我难过。3、时间的力量,女王驾到。以...

02-28 03:56:17

环球热文:抖音十大结婚歌曲有哪些
世界观速讯丨刀剑封魔录宝石合成表大全_刀剑封魔录宝石合成表
2021年什么时候入伏第一天 几号入伏 焦点热门
今日关注:张则谦:3.5黄金原油走势分析,黄金周线收阳下周还会涨吗?
天天要闻:考研日期一般是什么时候
报道:@临沂人 收到这类「医疗保险」诈骗短信,千万不要点!
外观设计专利是15年还是10年_外观设计专利
环球时讯:魔兽世界60年代宏_魔兽世界60年代
杜兰特大回环为什么这么有争议
“中国连续8年新能源汽车产销量世界第一”!李书福最新发声,他还提出了这些建议
热点在线丨“大家精要”丛书:《笛卡儿》
港科大允许学生使用ChatGPT!AI能加强教学,老师可自行决策|环球播资讯
1-[ 4,6-二甲基-5-嘧啶基羰基]-4-[_3S-4-[_1R-2-甲氧基-1-[4- 三氟甲基苯基]乙基]-3-甲基-1-哌嗪基]-4-
外交部发言人:美国才是世界最大的核威胁来源
观点:中欧班列(沈阳)集结中心班列首发
每日热门:骛与鹜的区别组词_鹜与骛的区别
英飞特2022年实现总营收15.13亿元 同比增长6.86% 天天快报
美联储发布半年度报告 强调坚定致力于将通胀率降至2% 世界快播报
全球焦点!长春身份证补办指南
淋漓尽致是什么意思 百度网盘_淋漓尽致是什么意思
观速讯丨河南禹州一酒店发生刑案致1人死亡,犯罪嫌疑人已被抓获
全球报道:厨余垃圾有哪些_说一说厨余垃圾有哪些的简介
毫克和克的换算关系_克与毫克的换算关系 当前快报
3月1日基金净值:易方达远见成长混合A最新净值1.1504,涨2.04%_全球资讯
绝笔诗_绝笔|天天快消息
冷酸灵,不再是“原厂”?
速讯:怎么看平板短信验证码是多少_短信验证码是多少
哈伊杜克U19在欧青联1/8比赛中2比1击败曼城...
天天热头条丨中国高校数量很多但本科教育薄弱,学生可以混文凭,开想出人才难度太大。
人民币对台币汇率走势(2023年3月1日)
五年级动物说明文作文500字大全猫-天天观点
2023年4月汕头自考注意事项-每日速递
森赫股份:截至2023年2月28日,公司股东人数为14,401人 全球观热点
EQ健康宝贝
焦点关注:“轨道上的大湾区”跑出“加速度”
热继电器型号规格全解_热继电器型号
鬼影重重魔腾背景故事_鬼影重重魔腾
大脖子病和甲亢的区别是什么_大脖子病和甲亢的区别_环球视点
(规则类怪谈)金利中学
2月28日工行纸黄金USD开盘价1813.98昨收价1813.98 国际黄金修复后下行 环球简讯
1平方米等于多少平方分米_1平方米等于多少米|当前快播
23内蒙古债02今日发布发行公告
恒生科技指数午后跌超2%,哔哩哔哩跌近7% 环球新视野
除颤仪的使用及维护_除颤仪的使用 天天快资讯
每日聚焦:shotmaking
抖音向超级APP一路“狂飙”,烧钱的外卖O2O真值得做吗?
网红脸是什么脸型_网红脸是什么意思
雪却输梅一段香的全诗的草书书法作品_雪却输梅一段香的全诗
你怎么舍得我难过尚雯婕完整版_你怎么舍得我难过 尚雯婕|天天速讯
热讯:信安世纪: 关于向银行申请综合授信额度的公告
X 广告
资讯
X 广告

Copyright ©  2015-2022 亚太畜牧网版权所有  备案号:沪ICP备2020036824号-11   联系邮箱: 562 66 29@qq.com