为什么Flutter写的界面比Unity3D流畅？ 第1页

碰巧去年参与了一个盒马小镇的游戏化项目，因为盒马是阿里系，所以强推flutter，应该是跟他们的技术栈有关，但是最终评估下来还是选了egret。

flutter的核心问题是其渲染调用逻辑不适合于游戏项目，因为flutter在这块上更像是react vue这种页面框架，是为不常的刷新页面且要刷新也只是局部控件重绘的，因此他们重绘一次界面的时间点在一个setState的时候，对于对应被改变状态的控件进行立即重绘。就这一点就完完全全不适合每一帧整个画面都有70%以上元素需要重绘的游戏项目，当然也正是因此，他是有可能产生比unity甚至是所有游戏引擎显然更流畅的错觉的。

之所以造成flutter看起来更流畅，实际上是因为你的“游戏”需要渲染的东西非常简单，很可能就真的只有非常简单的几个css控件而已（这里先不讨论css完全不适合做游戏ui的问题），甚至你的“游戏”逻辑改的往往只是一些label，连动画可能都没有。这时候底层重绘一次整个页面的用时非常之小（远低于1/60秒），其实际fps是非常高的，flutter没记错的话是没有游戏的update概念的，所以就不存在“锁帧”这么一说。事实上有很多简单的小游戏不锁帧fps也远大于60的（顺带一提，早年的武林群侠转，也就是江湖小虾米那个游戏，你用现在的电脑跑跑看，别用变速齿轮，就会让你体验这种“flutter式的流畅”），更何况是你的“游戏”很可能都到不了demo级，只是UI美术素材看起来是哪儿扒来的好看点，但是对于渲染逻辑来说不会比绘制一个方块“麻烦”多少。而因为你的“游戏”本身不太需要update，比如对于界面的改变量极小，外加你调用update的频率比较高，比如你在didMount打个log出来看看就会发现这个log要么不出现要么一次性出现非常多，所以导致了部分时间渲染处理是空闲的，不空闲的时候“帧率”极高（因为setState一次相当于unity执行一次update），这种不稳定结合元素简单本身就可以达到极高帧率，所以产生了这个错觉——你可以试试看unity也就放这么点东西，然后设置里面不锁帧，他一样会非常“流畅”。

因此，简单的界面下，不管是不是游戏，只要整个页面足够简单，非游戏框架，就拿h5来说，flutter react都会比游戏引擎egret laya cocos显得流畅，但这是因为做错了才产生的错觉，当你做一个正常的游戏的时候，这些非游戏框架的问题就会暴露，不光性能可能扛不住，就是真的做个游戏界面，css也是完全不合适的——这些非游戏框架的设计思路本身和做游戏就是完全完全不同的，包括布局包括渲染刷新方案，这跟针对的业务是有关的。