javascript - 使用 OO Javascript、ThreeJS 和 ScrollMagic 的网络 worker

标签 javascript three.js web-worker scrollmagic

我正在开发一个个人网站,将 Three.js 和 ScrollMagic 与 OO Javascript 相结合。随着用户滚动 3d 对象变换。这一切都很好,但存在轻微的性能问题。为了改进这一点,我想将一些计算位置的循环/for 函数移动到网络 worker (每当我调用循环函数时滚动滞后)。

问题是我正在尝试将类实例 (THREE.PointCloud) 的数组 (512) 传递给网络 worker 。我似乎无法从 Web Worker 中的这些实例中获得任何有意义的完整属性。

首先,我只是试图将数组传递给工作人员并收到此错误“Uncaught DataCloneError: Failed to execute 'postMessage' on 'Worker': An object could not be cloned.”

然后我意识到我不能这样做,所以我使用了 JSON.stringify() 和 JSON.Parse()。我可以获得数组的长度。但是,我无法获取每个实例的属性。

我想我需要使用 ArrayBuffer?但我不知道如何将我的实例数组转换为 ArrayBuffer。任何人?还是有更简单的方法来提高性能?

非常感谢您的帮助。

谢谢。

最佳答案

我认为您可能是对的,您需要一个 ArrayBuffer(或类似的)。 使用 postMessage() 不会真正让你得到你想要的东西。因为在某些情况下,json(反)序列化过程是一个相当耗时的过程。

但您可能正在寻找的是“可转移对象”。它不是克隆对象,而是更改所有者,因此不需要复制。

网上有很多地方都在谈论传输对象,所以 google 会是你的 friend 。但这里有一个 https://developer.mozilla.org/en-US/docs/Web/API/Worker/postMessage

希望对您有所帮助。

关于javascript - 使用 OO Javascript、ThreeJS 和 ScrollMagic 的网络 worker ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31880821/

相关文章:

javascript - NodeJS 应用程序布局和变量传递

javascript - Accordion 箭头定位在 div 内

javascript - 释放 ThreeJS 应用程序的内存

javascript - 使用鼠标在 Threejs 场景中移动对象

javascript - 停止后如何重新启动网络 worker

javascript - 在 Web Worker 中解析 XML

javascript - 按下按钮时,将一个 div 推到当前 div 下面

javascript - 如果检查通过,为什么会这样?

javascript - 自定义着色器中的灯光位置(着色器 Material )

javascript - 使用 Web Worker 进行异步 Canvas 绘制