Question

我使用非常大的阵列运行了一些效果，我注意到我的计算机滞后，所以我想切换到使用我的 GPU 而不是我的 CPU 来进行这些计算。

我在 React 应用程序中安装了 gpu.js，但是当我尝试创建内核时，它会引发错误。

无论我做什么或更改它总是会引发错误。

<块引用>

注意：这是一个 ReactJS 类组件中的函数

我的其中一种效果代码：

bubbles = [];

drawBubbles = () => {
  const ctx = this.Canvas.getContext("2d");

  ctx.strokeStyle = "white";
  ctx.globalAlpha = 0.6;

  if (this.bubbles.length) {
    const gpu = new GPU();

    // Here is where my problem lies
    const kernel = gpu.createKernel(
      function (bubbles) {
        const i = this.thread.x;
        const bubble = bubbles[i];

        bubble.y -= bubble.speed;
        if (bubble.y + bubble.speed * 2 < 0) {
          bubble.y = this.Canvas.height + bubble.speed * 2;
          bubble.x = Math.random() * this.Canvas.width;
        }

        if (Math.floor(Math.random() * 2) === 0) {
          bubble.x += Math.random() * 6 - 2.5;
        }

        ctx.lineWidth = bubble.speed / 2.5;

        ctx.beginPath();
        ctx.arc(bubble.x, bubble.y, bubble.speed * 2, 0, 2 * Math.PI);
        ctx.stroke();
      },
      { output: [this.bubbles.length] }
    );
    kernel(this.bubbles);
  } else {
    for (let i = 0; i < 15; i++) {
      this.bubbles.push({
        x: Math.random() * this.Canvas.width,
        y: Math.random() * this.Canvas.height,
        speed: Math.random() * 3 + 1,
      });
    }
  }
};

我每秒运行 this.drawBubbles(); 次约 60 次（以及其他一些效果，最多 3000 个或更多的数组对象和繁重的计算）

我收到一条致命的错误信息：Error: Unexpected expression on line 16, position 9: bubble.y

我一直在尝试解决这个问题，但我已经四处寻找问题的答案，但找不到。

当我创建内核时 gpu.js 抛出错误

0 个答案: