在Canvas 2D或p5.js中是否存在某种VBO / VAO?

时间:2019-09-10 05:58:30

标签: javascript html5-canvas webgl p5.js

我正在研究一个使用行进平方算法的项目。它输出许多多边形,这在我通过常规的p5.js方式绘制时会导致性能下降。我从OpenGL和WebGL知道,有VBO / VAO,可以让您更快地绘制。 p5.j​​s或canvas 2d中有类似的功能吗?还是有更好的解决方案,例如直接使用WebGL?

我有一个1000x1000的体素网格,该网格通过行进平方算法生成多边形数组。 我目前每帧绘制三个多边形列表。 我使用p5.js在每一帧绘制它。一帧的绘制时间超过500毫秒。 为了减少它,我认为最好的解决方案是将某种VBO / VAO与p5.js或canvas 2d一起使用。

这是使用p5.js绘制一个多边形列表的代码:

polys.forEach(function(poly : number[][]) {
  g.beginShape();
  poly.forEach(function(vert : number[]) {
    var x = vert[0];
    var y = vert[1];
    g.vertex(x, y);
  });
  g.endShape();
});

我需要将绘制时间大大减少到50ms或更短。

0 个答案:

没有答案