0

当我以 JavaScript 风格编写 Processing.js 时，我收到了一个性能警告，当我使用 Processing.js 解析处理代码时，我没有收到。我已经创建了一个相当简单的带有 3d 支持的草图来进入它，控制台充满了这个警告：

性能警告：属性 0 已禁用。这有显着的性能损失

这意味着什么？更重要的是：如何解决它？

那是草图。（在 codepen.io 上观看/编辑）

var can = document.createElement("canvas");
var sketch = function(p){

  p.setup = function(){
    p.size(800, 600, p.OPENGL);
    p.fill(170);
  };

  p.draw = function(){
    p.pushMatrix();
    p.translate(p.width/2, p.height/2);
    p.box(50);
    p.popMatrix();
  };
};

document.body.appendChild(can);
new Processing(can, sketch);
4

1 回答 1

3

这是 Processing.js 中的一个问题

详细解释：OpenGL和OpenGL ES都有属性。所有属性都可以从缓冲区中获取值或提供一个常量值。除了，在 OpenGL 中属性 0 是特殊的。它不能提供一个常数值。它必须从缓冲区中获取值。WebGL 虽然基于没有此限制的 OpenGL ES 2.0。

因此，当 WebGL 在 OpenGL 之上运行并且用户不使用属性 0（它被设置为使用常量值）时，WebGL 必须创建一个临时缓冲区，用常量值填充它，然后将其提供给 OpenGL。这很慢。因此发出警告。

Processing 中的问题是它们有一个处理多个用例的着色器。它具有法线、位置、颜色和纹理坐标的属性。根据您要求处理绘制的内容，它可能不会使用所有这些属性。例如，通常它可能不使用法线。仅在处理中需要法线来支持灯光，因此如果您没有灯光，则没有法线（我猜）。在这种情况下，他们会关闭法线。不幸的是，如果法线恰好在属性 0 上，为了让 WebGL 渲染，它必须创建一个临时缓冲区，用一个常量值填充它，然后再渲染。

解决此问题的方法是始终使用属性 0。在处理的情况下，它们将始终使用位置数据。所以在链接他们的着色器之前，他们应该调用bindAttribLocation

// "aVertex" is the name of the attribute used for position data in
// Processing.js
gl.bindAttribLocation(program, 0, "aVertex");

这将使属性“aVertex”始终使用属性 0，因为对于每个用例，他们总是使用“aVertex”，因此他们永远不会收到该警告。

理想情况下，您应该始终绑定您的位置。这样您就不必在链接后查询它们。

于 2013-02-21T01:49:32.110 回答