尽管在WebGL中进行了优化,但帧率很低

时间:2015-12-11 17:04:13

标签: javascript performance three.js webgl

我正在使用Three.Js在WEBGL中开发一个项目。

该项目包括静态几何房间和数百个复制椅子。将整个事物放在一起并使用以下技术优化帧速率后:

  • 主席的实例化 - 每个对象都加载一次,然后实例化,并在一个循环中添加到场景中,使用object.clone()。

  • 对象选择光线投射的八叉树优化。

  • 所有静态对象的几何合并。

  • 实例化对象的LOD级别。

当所有场景放在一起时,我仍然有15fps的糟糕表现。我正在使用两个方向灯和一个半球灯。

经过一些实验,似乎瓶颈在于几何体本身。

有没有人知道可能是什么问题?对于可接受的帧率,合理的多边形数量是多少?可能是我使用的几何体太重了吗?

有关信息,

我的房间几何图形有:     69996分,     290571个顶点,     82607原语

我的椅子几何图形有:     1254分,     4884个顶点,     1232个原语

2 个答案:

答案 0 :(得分:1)

我不认为问题仅在于几何体的多边形数量。我以60 fps渲染了更多。没有代码,很难说问题在哪里。我认为你应该首先剖析它,看看你是否发现了任何瓶颈。然后获取webGL检查器并获取GPU跟踪。跟踪drawXXX的调用次数。这比聚合计数更可能是瓶颈。

最后,如果你已经完成了三个j可用的每个优化,并且它仍然不够快,那么它可能是一个三j问题。毫不掩饰的是,三j并没有将性能作为其主要目标之一。如果是这种情况,那么不幸的是你有点卡住了。

答案 1 :(得分:0)

最后,似乎WacławJasper是对的,抽签呼叫过度(每个椅子一个),这是使FPS像疯了一样下降的瓶颈。

解决方案基于:https://gamedev.stackexchange.com/questions/81570/merging-geometry-mesh-without-losing-benefits

通过进行几何合并,并保持八叉树进行交叉计算,我设法复制了完全相同的系统,同时将drawcalls减少了90%,这大大提高了我的FPS速率。

感谢所有答案。