Jay*_*Dee 27 javascript performance html5 webgl
对于webgl中fps性能很重要的游戏,制作2D HUD的最有效方法是什么？我可以想到3个选项,但我不清楚每个选项的性能成本是多少,哪个是最有效的.
那么以下3个选项之间的相对性能成本是多少:
答:使用正交相机在3D中渲染具有多边形的hud并混合在原始场景上.优点是先进的opengl效果是可能的,代价是手动安排容器.
B:在html/css中构建HUD并让浏览器进行合成.在这种情况下,浏览器构成有很大的影响吗？
C:在3D画布上绘制2D画布,让浏览器进行合成.这是否可能,我是否会在画布之间传播事件,例如鼠标事件和焦点.
非常感谢!
Toj*_*oji 40
选项A在技术上可能是最快的,但会带来一大堆您需要手动处理的其他问题.如果你正在更新文本(健康,弹药等),你将不得不想出一个文本渲染例程,至少可以说这些是非常重要的.如果您通过鼠标或键盘与UI进行交互,则需要自己处理,并且您实现这一目标的可能性足够高,实际上可以产生比本机浏览器小部件更好的体验.重点是,为了更快一点的潜力,需要做很多工作.
在我看来,选项B是要走的路.虽然浏览器非常擅长合成,但即使它会因此而受到打击,除非你正在做一个非常疯狂的详细HUD,我猜想与你的应用程序的其他部分(如JS逻辑)相比,命中率可以忽略不计.此外,这是一条随着时间的推移应该"神奇地"变得更好的路线,而浏览器在他们所做的事情上变得更有效率.IMO最大的缺点是你可能会遇到一些渲染错误,如果你正在使用一些最新的和最好的CSS效果来按照你想要的方式设置你的HUD样式,但是随着时间的推移它会再次消失.
据我所知,选项C在单个画布中是不可能的.你可以将一个单独的2D画布分层放在你的3D画布上并绘制你的HUD,但此时你继承了A和B的所有问题而没有任何好处.我认为没有理由推荐它.
我认为WebGL在许多原生3D平台上的一大优势在于它可以轻松访问地球上使用最广泛且最灵活的UI框架之一(HTML).忽视这种优势将是一项巨大的努力,而且收效甚微.使用您可以使用的工具,并且因为它而不会过多地关注丢失的毫秒数.我向你保证,你在游戏过程中会面临更大的问题,你花费的时间和精力要比尝试重新发明这个特定的轮子要好得多.