Three.js:英特尔Mac上Chrome性能问题

1hdlvixo  于 2023-05-20  发布在  Go
关注(0)|答案(1)|浏览(259)

我创建了一个基于three.js的web应用程序来展示3d tiles。您可以在此链接后找到展示:https://www.karak.at/workbench/dd6228117c6faec166b208710b5a52d5
它是如何工作的:使用InstancedMesh多次加载和克隆OBJ文件以创建瓦片墙。接下来,将一个点和一个聚光灯添加到场景中。灯光的位置对当前鼠标位置起作用。场景将在mousemove上重新渲染。
渲染在基于M1的Mac上的所有浏览器和基于英特尔的Mac上的所有浏览器(除了Chrome)中都非常流畅。在基于英特尔的Mac电脑上使用Chrome 98版,电脑工作量很大,风扇上升,帧率下降,在最坏的情况下,应用程序崩溃。
以下是我的渲染器设置:

this.renderer = new THREE.WebGLRenderer({
        antialias: AA,
        powerPreference: "high-performance",
        depth: true,
        alpha: false,
        stencil: false
    });

下面是一个用于在隔离环境中展示问题的笔:https://codepen.io/Huangart/pen/VwrVjpj
我的应用程序的实现方面有什么问题吗?这是已知问题吗?如何解决Chrome的问题?

vof42yt1

vof42yt11#

我在同一个硬件上遇到了同样的问题。
我认为这与这个bug有关:https://bugs.chromium.org/p/chromium/issues/detail?id=1245448
about:flags上的ANGLE图形后端标志更改为Metal,在我的机器上大大提高了性能。

相关问题