Performance Warning Processing.js

Question

Lorsque j'écris Processing.js dans JavaScript-flavor, j'obtiens un avertissement de performance que je n'ai pas obtenu lorsque j'ai utilisé Processing.js pour analyser Processing-Code. J'ai créé un croquis assez simple avec un support 3D pour y entrer et la console est inondée avec cet avertissement:

PERFORMANCE AVERTISSEMENT: L'attribut 0 est désactivé. Cela a une pénalité de performance significative

Qu'est-ce que cela signifie? Et plus important encore: comment le réparer?

C'est le croquis. (watch/edit on 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); 

Answer 1

Ceci est un problème dans Processing.js

Pour une explication détaillée: OpenGL et OpenGL ES ont des attributs. Tous les attributs peuvent extraire des valeurs à partir de tampons ou fournir une valeur constante. Sauf, dans l'attribut OpenGL, 0 est spécial. Il ne peut pas fournir une valeur constante. Il DOIT obtenir des valeurs d'un tampon. WebGL est basé sur OpenGL ES 2.0 qui n'a pas cette limitation. Ainsi, lorsque WebGL s'exécute sur OpenGL et que l'utilisateur n'utilise pas l'attribut 0 (il est configuré pour utiliser une valeur constante), WebGL doit créer un tampon temporaire, le remplir avec la valeur constante et lui donner à OpenGL. C'est lent. D'où l'avertissement.

Le problème dans le traitement est qu'ils ont un seul shader qui gère plusieurs cas d'utilisation. Il a des attributs pour les normales, les positions, les couleurs et les coordonnées de texture. En fonction de ce que vous demandez à Processing, il risque de ne pas utiliser tous ces attributs. Par exemple, il pourrait ne pas utiliser de normales. Normales sont seulement nécessaires dans le traitement pour soutenir les lumières, donc si vous n'avez pas de lumières, il n'y a pas de normales (je devine). Dans ce cas, ils désactivent les normales. Malheureusement, si les normales se trouvent sur l'attribut 0, pour que WebGL rende un tampon temporaire, remplissez-le avec une valeur constante, puis rendez le rendu.

Le moyen de contourner ceci est de toujours utiliser l'attribut 0. Dans le cas de traitement, ils utiliseront toujours des données de position. Donc, avant de lier leurs shaders qu'ils devraient appeler bindAttribLocation

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

Cela fera l'attribut « aVertex » utiliser toujours attrib 0 et puisque pour tous les cas d'utilisation, ils utilisent toujours « aVertex » ils vont jamais obtenir cet avertissement.

Idéalement, vous devriez toujours lier vos emplacements. De cette façon, vous n'avez pas à les interroger après la liaison.