Start · Sprachen · JavaScript · Referenz · WebGL2RenderingContext.isVertexArray()

WebGL2RenderingContext.isVertexArray()

Methode

Prüft, ob das übergebene Objekt ein gültiges, noch nicht gelöschtes <code>WebGLVertexArrayObject</code> ist, und gibt <code>true</code> oder <code>false</code> zurück.

seit JavaScript WebGL 2.0 – Baseline: alle modernen Browser (seit Kategorie: webapi

Signatur

WebGL2RenderingContext.prototype.isVertexArray(vertexArray)

Beschreibung

Mit isVertexArray() fragst du beim WebGL-2-Kontext nach, ob ein Objekt ein gültiges Vertex Array Object (VAO) ist. Ein VAO speichert den kompletten Zustand der Vertex-Attribute: welche Puffer an welche Attribute gebunden sind, Formate, Strides und Offsets sowie den gebundenen ELEMENT_ARRAY_BUFFER. Damit lassen sich ganze Geometrie-Konfigurationen mit einem einzigen bindVertexArray()-Aufruf wechseln.

Die Methode gibt nur dann true zurück, wenn das VAO mit createVertexArray() erzeugt, mindestens einmal mit bindVertexArray() gebunden und noch nicht mit deleteVertexArray() gelöscht wurde. Ein zwar erzeugtes, aber nie gebundenes VAO gilt laut OpenGL-ES-3.0-Semantik noch nicht als Vertex Array Object.

Typische Einsatzzwecke sind Debugging, Plausibilitätsprüfungen in Ressourcen-Managern oder Aufräum-Logik nach einem Kontextverlust (webglcontextlost). Im normalen Render-Loop solltest du die Methode nicht aufrufen, da jede Abfrage des GL-Zustands die Pipeline synchronisieren kann.

Parameter

Name Typ Default Beschreibung
$vertexArray Pflicht WebGLVertexArrayObject | null Das zu prüfende Objekt, üblicherweise ein Rückgabewert von gl.createVertexArray(). Bei null ist das Ergebnis false.

Rückgabewert

Typ
boolean
Beschreibung
true, wenn es sich um ein gültiges, bereits gebundenes und nicht gelöschtes VAO dieses Kontexts handelt, sonst false.

Beispiele

Lebenszyklus eines VAO prüfen

const canvas = document.createElement('canvas');
const gl = canvas.getContext('webgl2');

const vao = gl.createVertexArray();
console.log('nach create:', gl.isVertexArray(vao));

gl.bindVertexArray(vao);
console.log('nach bind:', gl.isVertexArray(vao));
gl.bindVertexArray(null);

gl.deleteVertexArray(vao);
console.log('nach delete:', gl.isVertexArray(vao));
console.log('null:', gl.isVertexArray(null));
nach create: false nach bind: true nach delete: false null: false

VAO mit Positionspuffer einrichten und validieren

const gl = document.querySelector('canvas').getContext('webgl2');

const createTriangleVAO = (gl, attribLocation = 0) => {
  const vao = gl.createVertexArray();
  gl.bindVertexArray(vao);

  const buffer = gl.createBuffer();
  gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
  gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([
    0, 0.5,  -0.5, -0.5,  0.5, -0.5
  ]), gl.STATIC_DRAW);

  gl.enableVertexAttribArray(attribLocation);
  gl.vertexAttribPointer(attribLocation, 2, gl.FLOAT, false, 0, 0);

  gl.bindVertexArray(null);
  return { vao, buffer };
};

const { vao } = createTriangleVAO(gl);
if (!gl.isVertexArray(vao)) {
  throw new Error('VAO konnte nicht angelegt werden');
}
console.log('VAO bereit');
VAO bereit

Sicheres Aufräumen in einem Ressourcen-Manager

class MeshRegistry {
  #gl;
  #vaos = new Map();

  constructor(gl) { this.#gl = gl; }

  add(name, vao) { this.#vaos.set(name, vao); }

  dispose() {
    const gl = this.#gl;
    for (const [name, vao] of this.#vaos) {
      if (gl.isVertexArray(vao)) {
        gl.deleteVertexArray(vao);
        console.log(`gelöscht: ${name}`);
      }
    }
    this.#vaos.clear();
  }
}

const gl = document.querySelector('canvas').getContext('webgl2');
const registry = new MeshRegistry(gl);
const vao = gl.createVertexArray();
gl.bindVertexArray(vao);
gl.bindVertexArray(null);
registry.add('wuerfel', vao);
registry.dispose();
gelöscht: wuerfel

// Wichtig · Fallstricke

  • Erst binden, dann gültig: Ein frisch mit createVertexArray() erzeugtes VAO liefert false, bis es einmal mit bindVertexArray() gebunden wurde.
  • Falscher Typ: Übergibst du etwas anderes als ein WebGLVertexArrayObject oder null (z. B. einen WebGLBuffer), wirft der Browser einen TypeError.
  • Anderer Kontext: Ein VAO aus einem anderen WebGL-Kontext ist hier ungültig. Du bekommst false, und je nach Browser wird zusätzlich ein GL-Fehler gesetzt.
  • Kontextverlust: Nach webglcontextlost liefert die Methode für alle VAOs false. Nach der Wiederherstellung musst du die Objekte neu anlegen.
  • Leistung: Rufe die Methode nicht in jedem Frame auf. Zustandsabfragen können den Treiber ausbremsen.
  • WebGL 1: Dort gibt es die Methode nicht. Die Entsprechung ist isVertexArrayOES() aus der Erweiterung OES_vertex_array_object.
  • Kompatibilität: WebGL 2 wird von allen aktuellen Browsern unterstützt (Safari ab Version 15). Prüfe trotzdem, ob getContext('webgl2') nicht null zurückgibt.