Start · Sprachen · JavaScript · Referenz · OES_vertex_array_object.deleteVertexArrayOES()

OES_vertex_array_object.deleteVertexArrayOES()

Methode

Löscht ein zuvor mit <code>createVertexArrayOES()</code> erzeugtes <code>WebGLVertexArrayObject</code> und gibt dessen GPU-Ressourcen frei.

seit JavaScript Baseline: alle Browser (WebGL-1-Erweiterung) Kategorie: webapi

Signatur

OES_vertex_array_object.prototype.deleteVertexArrayOES(arrayObject)

Beschreibung

Die Methode deleteVertexArrayOES() gehört zur WebGL-1-Erweiterung OES_vertex_array_object. Sie markiert ein Vertex Array Object (VAO) zum Löschen. Ein VAO speichert die komplette Attribut-Konfiguration, also vertexAttribPointer-Aufrufe, aktivierte Attribute und den gebundenen ELEMENT_ARRAY_BUFFER. So kann man beim Zeichnen mit einem einzigen Bind-Aufruf zwischen Geometrien wechseln.

Rufe die Methode auf, wenn du ein VAO nicht mehr brauchst. Das ist zum Beispiel der Fall, wenn ein Mesh aus der Szene entfernt wird, beim Wechsel eines Levels oder beim Aufräumen einer Komponente. Ist das VAO gerade gebunden, wird die Bindung automatisch auf das Standard-VAO (null) zurückgesetzt.

Wichtig: Das Löschen eines VAO löscht nicht die Puffer, auf die es verweist (WebGLBuffer). Diese musst du selbst mit gl.deleteBuffer() freigeben. In WebGL 2 ist die Funktion fest eingebaut und heißt gl.deleteVertexArray().

Parameter

Name Typ Default Beschreibung
$arrayObject Pflicht WebGLVertexArrayObject | null Das VAO, das gelöscht werden soll. Bei null oder einem bereits gelöschten Objekt passiert nichts.

Rückgabewert

Typ
void
Beschreibung
Kein Rückgabewert (undefined).

Beispiele

VAO erzeugen, nutzen und löschen

const canvas = document.createElement('canvas');
const gl = canvas.getContext('webgl');
const ext = gl.getExtension('OES_vertex_array_object');

if (!ext) {
  throw new Error('OES_vertex_array_object wird nicht unterstützt');
}

const vao = ext.createVertexArrayOES();
ext.bindVertexArrayOES(vao);

const buffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([0, 1, -1, -1, 1, -1]), gl.STATIC_DRAW);
gl.enableVertexAttribArray(0);
gl.vertexAttribPointer(0, 2, gl.FLOAT, false, 0, 0);

ext.bindVertexArrayOES(null);

// Aufräumen
ext.deleteVertexArrayOES(vao);
gl.deleteBuffer(buffer); // Puffer separat löschen!

console.log(ext.isVertexArrayOES(vao));
false

Mesh-Klasse mit dispose()-Methode

class Mesh {
  constructor(gl, ext, vertices) {
    this.gl = gl;
    this.ext = ext;
    this.vao = ext.createVertexArrayOES();
    ext.bindVertexArrayOES(this.vao);
    this.vbo = gl.createBuffer();
    gl.bindBuffer(gl.ARRAY_BUFFER, this.vbo);
    gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
    gl.enableVertexAttribArray(0);
    gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0);
    ext.bindVertexArrayOES(null);
  }

  dispose() {
    this.ext.deleteVertexArrayOES(this.vao);
    this.gl.deleteBuffer(this.vbo);
    this.vao = null;
    this.vbo = null;
  }
}

const gl = document.createElement('canvas').getContext('webgl');
const ext = gl.getExtension('OES_vertex_array_object');
const mesh = new Mesh(gl, ext, new Float32Array([0, 0, 0, 1, 0, 0, 0, 1, 0]));
mesh.dispose();
console.log(mesh.vao);
null

Einheitliche Hilfsfunktion für WebGL 1 und WebGL 2

const deleteVAO = (gl, vao) => {
  if (typeof WebGL2RenderingContext !== 'undefined' && gl instanceof WebGL2RenderingContext) {
    gl.deleteVertexArray(vao);
  } else {
    gl.getExtension('OES_vertex_array_object')?.deleteVertexArrayOES(vao);
  }
};

const gl = document.createElement('canvas').getContext('webgl');
const ext = gl.getExtension('OES_vertex_array_object');
const vao = ext.createVertexArrayOES();
deleteVAO(gl, vao);
console.log('VAO gelöscht:', !ext.isVertexArrayOES(vao));
VAO gelöscht: true

// Wichtig · Fallstricke

  • Puffer bleiben erhalten: Das Löschen des VAO gibt keine WebGLBuffer frei. Rufe dafür zusätzlich gl.deleteBuffer() auf, sonst belegen die Puffer weiter GPU-Speicher.
  • Wird ein gebundenes VAO gelöscht, ist danach automatisch das Standard-VAO aktiv. Nachfolgende vertexAttribPointer-Aufrufe verändern dann den Standardzustand. Das kann schwer zu findende Fehler verursachen.
  • Ein gelöschtes VAO darf nicht erneut gebunden werden, sonst meldet WebGL den Fehler INVALID_OPERATION. Setze deine Referenz nach dem Löschen am besten auf null.
  • Das VAO muss aus demselben Kontext stammen, sonst gibt es ebenfalls INVALID_OPERATION. Geht der Kontext verloren (webglcontextlost), sind alle VAOs ohnehin ungültig.
  • Kompatibilität: Die Erweiterung ist in nahezu allen WebGL-1-Implementierungen verfügbar. Prüfe trotzdem, ob getExtension() etwas zurückgibt. In WebGL-2-Kontexten gibt es die Erweiterung nicht; nutze dort gl.deleteVertexArray().