@codexo/exojs-particles 0.15.3 → 0.16.0

package/dist/esm/renderers/WebGl2ParticleRenderer.js

@@ -1,325 +1,321 @@
-import { AbstractWebGl2Renderer, Shader, RenderingPrimitives, createWebGl2ShaderProgram, WebGl2RenderBuffer, BufferTypes, BufferUsage, WebGl2VertexArrayObject } from '@codexo/exojs/renderer-sdk';
-import fragmentSource from './glsl/particle.frag.js';
-import vertexSource from './glsl/particle.vert.js';
+import { assertVertexGeometryCompatible } from "../renderModes/ParticleBufferLayout.js";
+import { AbstractWebGl2Renderer, BufferTypes, BufferUsage, RenderingPrimitives, Shader, WebGl2RenderBuffer, WebGl2VertexArrayObject, createWebGl2ShaderProgram, uploadBufferRange, uploadBufferStore } from "@codexo/exojs/renderer-sdk";
 
+//#region src/renderers/WebGl2ParticleRenderer.ts
+const resolvePrimitive = (topology) => {
+	switch (topology) {
+		case "triangle-list": return RenderingPrimitives.Triangles;
+		case "triangle-strip": return RenderingPrimitives.TriangleStrip;
+	}
+};
+const usageByGeometryUsage = {
+	static: BufferUsage.StaticDraw,
+	dynamic: BufferUsage.DynamicDraw,
+	stream: BufferUsage.StreamDraw
+};
 /**
- * Instanced particle renderer for WebGL2.
- *
- * One ParticleSystem = one batch. Each `render(system)` flushes any
- * pending batch, sets the system-level uniforms (transform, local
- * bounds, texture), and packs every active particle into the per-instance
- * buffer. The next `flush()` issues a single `drawElementsInstanced`.
- *
- * Per-instance layout (40 bytes per particle, 6 attributes):
- * ```
- *   translation  f32x2  (offset  0,  8 bytes)  particle position (system-local)
- *   scale        f32x2  (offset  8,  8 bytes)
- *   rotation     f32    (offset 16,  4 bytes)  degrees
- *   color        u8x4   (offset 20,  4 bytes)  RGBA tint, normalised
- *   uvMin        f32x2  (offset 24,  8 bytes)  pre-resolved frame uvMin
- *   uvMax        f32x2  (offset 32,  8 bytes)  pre-resolved frame uvMax
- * ```
- *
- * UVs are baked per-particle so the system can carry an atlas of frames
- * — `system.frames` declares the rectangles; each particle's
- * `textureIndex` selects one. The pack loop resolves frame-rectangle to
- * UVs once per particle per frame; no per-instance shader-side indexing
- * needed.
- */
-const instanceStrideBytes = 40;
-const wordsPerInstance = instanceStrideBytes / Uint32Array.BYTES_PER_ELEMENT;
-const indicesPerQuad = 6;
-const quadIndices = new Uint16Array([0, 1, 2, 0, 2, 3]);
-class WebGl2ParticleRenderer extends AbstractWebGl2Renderer {
-    /**
-     * The particle system's transform is bound as a `u_systemTransform` uniform and
-     * each particle is positioned system-locally, so this renderer never reads the
-     * shared {@link TransformBuffer}; the render-group upload boundary skips writing
-     * transform records for particle draws.
-     * @internal
-     */
-    _consumesSharedTransform = false;
-    _shader;
-    _batchSize;
-    _instanceData;
-    _instanceFloat32;
-    _instanceUint32;
-    _instanceCount = 0;
-    _currentTexture = null;
-    _currentBlendMode = null;
-    _currentView = null;
-    _currentViewId = -1;
-    _instanceBuffer = null;
-    _indexBuffer = null;
-    _vao = null;
-    _connection = null;
-    constructor(batchSize) {
-        super();
-        this._batchSize = batchSize;
-        this._shader = new Shader(vertexSource, fragmentSource);
-        this._instanceData = new ArrayBuffer(batchSize * instanceStrideBytes);
-        this._instanceFloat32 = new Float32Array(this._instanceData);
-        this._instanceUint32 = new Uint32Array(this._instanceData);
-    }
-    render(system) {
-        const backend = this.getBackend();
-        const { texture, blendMode } = system;
-        const textureChanged = texture !== this._currentTexture;
-        const blendModeChanged = blendMode !== this._currentBlendMode;
-        // System transform / texture / UV / local-bounds are uniforms, so
-        // mixing systems in one batch is invalid. Flush any prior system
-        // before setting up this one.
-        this.flush();
-        if (textureChanged) {
-            this._currentTexture = texture;
-            backend.bindTexture(texture);
-        }
-        if (blendModeChanged) {
-            this._currentBlendMode = blendMode;
-            backend.setBlendMode(blendMode);
-        }
-        // System-level uniforms are set before packing so the eventual
-        // flush() can sync them in one go.
-        const localBounds = system.vertices;
-        this._shader.getUniform('u_systemTransform').setValue(system.getGlobalTransform().toArray(false));
-        this._shader.getUniform('u_localBounds').setValue(localBounds);
-        const f32 = this._instanceFloat32;
-        const u32 = this._instanceUint32;
-        const { posX, posY, scaleX, scaleY, rotations, color, textureIndex, alive } = system;
-        const limit = Math.min(system.liveCount, this._batchSize);
-        // Pre-compute frame UVs from system.frames + texture; falls back
-        // to the system.textureFrame when no atlas is declared.
-        const { uvMins, uvMaxs } = this._computeFrameUvs(system);
-        const frameCount = uvMins.length / 2;
-        const fallbackFrame = frameCount > 0 ? 0 : 0;
-        let writeIndex = 0;
-        for (let i = 0; i < limit; i++) {
-            // Skip dead slots in GPU-mode systems where the live range can
-            // contain holes.
-            if (alive[i] === 0) {
-                continue;
-            }
-            const offset = writeIndex * wordsPerInstance;
-            const frame = textureIndex[i] < frameCount ? textureIndex[i] : fallbackFrame;
-            const uvBase = frame * 2;
-            f32[offset + 0] = posX[i];
-            f32[offset + 1] = posY[i];
-            f32[offset + 2] = scaleX[i];
-            f32[offset + 3] = scaleY[i];
-            f32[offset + 4] = rotations[i];
-            u32[offset + 5] = color[i];
-            f32[offset + 6] = uvMins[uvBase + 0];
-            f32[offset + 7] = uvMins[uvBase + 1];
-            f32[offset + 8] = uvMaxs[uvBase + 0];
-            f32[offset + 9] = uvMaxs[uvBase + 1];
-            writeIndex++;
-        }
-        this._instanceCount = writeIndex;
-        return this;
-    }
-    /**
-     * Compute (uvMin, uvMax) pairs for every declared frame on the system.
-     * Pulled lazily and cached per (system, texture-version) to avoid the
-     * arithmetic in the hot pack loop. Falls back to a single entry from
-     * `system.textureFrame` when no atlas is declared.
-     */
-    _computeFrameUvs(system) {
-        const frames = system.frames;
-        const tex = system.texture;
-        const texW = tex.width;
-        const texH = tex.height;
-        const flipY = tex.flipY;
-        const count = frames.length === 0 ? 1 : frames.length;
-        // Re-allocate scratch when capacity grows.
-        if (this._uvMinsScratch.length < count * 2) {
-            this._uvMinsScratch = new Float32Array(count * 2);
-            this._uvMaxsScratch = new Float32Array(count * 2);
-        }
-        const mins = this._uvMinsScratch;
-        const maxs = this._uvMaxsScratch;
-        if (frames.length === 0) {
-            const f = system.textureFrame;
-            const minU = f.left / texW;
-            const maxU = f.right / texW;
-            const topV = f.top / texH;
-            const bottomV = f.bottom / texH;
-            mins[0] = minU;
-            mins[1] = flipY ? bottomV : topV;
-            maxs[0] = maxU;
-            maxs[1] = flipY ? topV : bottomV;
-            return { uvMins: mins, uvMaxs: maxs };
-        }
-        for (let i = 0; i < frames.length; i++) {
-            const f = frames[i];
-            const o = i * 2;
-            const minU = f.left / texW;
-            const maxU = f.right / texW;
-            const topV = f.top / texH;
-            const bottomV = f.bottom / texH;
-            mins[o + 0] = minU;
-            mins[o + 1] = flipY ? bottomV : topV;
-            maxs[o + 0] = maxU;
-            maxs[o + 1] = flipY ? topV : bottomV;
-        }
-        return { uvMins: mins, uvMaxs: maxs };
-    }
-    _uvMinsScratch = new Float32Array(2);
-    _uvMaxsScratch = new Float32Array(2);
-    flush() {
-        const backend = this.getBackendOrNull();
-        const instanceBuffer = this._instanceBuffer;
-        const indexBuffer = this._indexBuffer;
-        const vao = this._vao;
-        if (this._instanceCount === 0 || backend === null || instanceBuffer === null || indexBuffer === null || vao === null) {
-            return;
-        }
-        const view = backend.view;
-        if (this._currentView !== view || this._currentViewId !== view.updateId) {
-            this._currentView = view;
-            this._currentViewId = view.updateId;
-            this._shader.getUniform('u_projection').setValue(view.getTransform().toArray(false));
-        }
-        this._shader.sync();
-        backend.bindVertexArrayObject(vao);
-        instanceBuffer.upload(this._instanceFloat32.subarray(0, this._instanceCount * wordsPerInstance));
-        vao.drawInstanced(indicesPerQuad, 0, this._instanceCount, RenderingPrimitives.Triangles);
-        backend.stats.batches++;
-        backend.stats.drawCalls++;
-        this._instanceCount = 0;
-    }
-    onConnect(backend) {
-        const gl = backend.context;
-        this._shader.connect(createWebGl2ShaderProgram(gl));
-        this._connection = this._createConnection(gl);
-        this._indexBuffer = new WebGl2RenderBuffer(BufferTypes.ElementArrayBuffer, quadIndices, BufferUsage.StaticDraw).connect(this._createBufferRuntime(this._connection));
-        this._instanceBuffer = new WebGl2RenderBuffer(BufferTypes.ArrayBuffer, this._instanceData, BufferUsage.DynamicDraw).connect(this._createBufferRuntime(this._connection));
-        this._shader.sync();
-        this._vao = new WebGl2VertexArrayObject()
-            .addIndex(this._indexBuffer)
-            .addAttribute(this._instanceBuffer, this._shader.getAttribute('a_translation'), gl.FLOAT, false, instanceStrideBytes, 0, false, 1)
-            .addAttribute(this._instanceBuffer, this._shader.getAttribute('a_scale'), gl.FLOAT, false, instanceStrideBytes, 8, false, 1)
-            .addAttribute(this._instanceBuffer, this._shader.getAttribute('a_rotation'), gl.FLOAT, false, instanceStrideBytes, 16, false, 1)
-            .addAttribute(this._instanceBuffer, this._shader.getAttribute('a_color'), gl.UNSIGNED_BYTE, true, instanceStrideBytes, 20, false, 1)
-            .addAttribute(this._instanceBuffer, this._shader.getAttribute('a_uvMin'), gl.FLOAT, false, instanceStrideBytes, 24, false, 1)
-            .addAttribute(this._instanceBuffer, this._shader.getAttribute('a_uvMax'), gl.FLOAT, false, instanceStrideBytes, 32, false, 1)
-            .connect(this._createVaoRuntime(this._connection));
-    }
-    onDisconnect() {
-        this._shader.disconnect();
-        this._instanceBuffer?.destroy();
-        this._instanceBuffer = null;
-        this._indexBuffer?.destroy();
-        this._indexBuffer = null;
-        this._vao?.destroy();
-        this._vao = null;
-        this._connection = null;
-        this._currentTexture = null;
-        this._currentBlendMode = null;
-        this._currentView = null;
-        this._currentViewId = -1;
-        this._instanceCount = 0;
-    }
-    destroy() {
-        this.disconnect();
-        this._shader.destroy();
-    }
-    _createConnection(gl) {
-        const vaoHandle = gl.createVertexArray();
-        if (vaoHandle === null) {
-            throw new Error('WebGl2ParticleRenderer: could not create vertex array object.');
-        }
-        return {
-            gl,
-            buffers: new Map(),
-            vaoHandle,
-        };
-    }
-    _createBufferRuntime(connection) {
-        const handle = connection.gl.createBuffer();
-        if (handle === null) {
-            throw new Error('WebGl2ParticleRenderer: could not create render buffer.');
-        }
-        return {
-            bind: (buffer) => {
-                connection.gl.bindBuffer(buffer.type, handle);
-            },
-            upload: (buffer, offset) => {
-                const gl = connection.gl;
-                const data = buffer.data;
-                const state = connection.buffers.get(buffer);
-                gl.bindBuffer(buffer.type, handle);
-                if (state && state.dataByteLength >= data.byteLength) {
-                    gl.bufferSubData(buffer.type, offset, data);
-                    state.dataByteLength = data.byteLength;
-                }
-                else {
-                    gl.bufferData(buffer.type, data, buffer.usage);
-                    connection.buffers.set(buffer, { handle, dataByteLength: data.byteLength });
-                }
-            },
-            destroy: (buffer) => {
-                connection.gl.deleteBuffer(handle);
-                connection.buffers.delete(buffer);
-                buffer.disconnect();
-            },
-        };
-    }
-    _createVaoRuntime(connection) {
-        let appliedVersion = -1;
-        return {
-            bind: (vao) => {
-                const gl = connection.gl;
-                gl.bindVertexArray(connection.vaoHandle);
-                if (appliedVersion !== vao.version) {
-                    let lastBuffer = null;
-                    for (const attribute of vao.attributes) {
-                        if (lastBuffer !== attribute.buffer) {
-                            attribute.buffer.bind();
-                            lastBuffer = attribute.buffer;
-                        }
-                        if (attribute.integer) {
-                            gl.vertexAttribIPointer(attribute.location, attribute.size, attribute.type, attribute.stride, attribute.start);
-                        }
-                        else {
-                            gl.vertexAttribPointer(attribute.location, attribute.size, attribute.type, attribute.normalized, attribute.stride, attribute.start);
-                        }
-                        gl.enableVertexAttribArray(attribute.location);
-                        gl.vertexAttribDivisor(attribute.location, attribute.divisor);
-                    }
-                    if (vao.indexBuffer) {
-                        vao.indexBuffer.bind();
-                    }
-                    appliedVersion = vao.version;
-                }
-            },
-            unbind: () => {
-                connection.gl.bindVertexArray(null);
-            },
-            draw: (vao, size, start, type) => {
-                const gl = connection.gl;
-                if (vao.indexBuffer) {
-                    gl.drawElements(type, size, gl.UNSIGNED_SHORT, start);
-                }
-                else {
-                    gl.drawArrays(type, start, size);
-                }
-            },
-            drawInstanced: (vao, count, start, instanceCount, type) => {
-                const gl = connection.gl;
-                if (vao.indexBuffer) {
-                    gl.drawElementsInstanced(type, count, gl.UNSIGNED_SHORT, start, instanceCount);
-                }
-                else {
-                    gl.drawArraysInstanced(type, start, count, instanceCount);
-                }
-            },
-            destroy: (vao) => {
-                connection.gl.deleteVertexArray(connection.vaoHandle);
-                vao.disconnect();
-            },
-        };
-    }
-}
+* Attribute component types that reach the shader as raw integers rather than
+* as floats. Everything else - including normalised integer types such as the
+* quad mode's `u8x4` colour - goes through `vertexAttribPointer` and arrives as
+* a float, so only these two need `vertexAttribIPointer`.
+*/
+const integerAttributeTypes = /* @__PURE__ */ new Set(["u32", "i32"]);
+const resolveAttributeType = (gl, type) => {
+	switch (type) {
+		case "f32": return gl.FLOAT;
+		case "u8": return gl.UNSIGNED_BYTE;
+		case "u16": return gl.UNSIGNED_SHORT;
+		case "u32": return gl.UNSIGNED_INT;
+		case "i32": return gl.INT;
+	}
+};
+/**
+* Particle renderer for WebGL2.
+*
+* One ParticleSystem = one batch. The system's {@link ParticleRenderMode} owns
+* the *how* - vertex layout, shader pair, draw model and the loop that fills
+* the buffer - and this renderer is the executor: each `render(system)` flushes
+* any pending batch, sets the system-level uniforms (transform, local bounds,
+* texture) and asks the mode to build its vertex data. The next `flush()`
+* uploads that data and issues the single draw the mode declares.
+*
+* Everything mode-specific is read off the mode's `dataLayout`/`Material`, so a
+* new primitive is a new mode rather than a change here: the vertex array
+* object is wired from the layout's named attributes, the draw is instanced or
+* plain per `ParticleRenderMode.instanced`, and its primitive comes from the
+* topology.
+*
+* A mode declaring a `vertexGeometry` adds a second buffer to that vertex array
+* object, stepping per vertex (divisor 0) beside the per-instance one, and its
+* geometry supplies the topology and indices instead.
+*/
+var WebGl2ParticleRenderer = class extends AbstractWebGl2Renderer {
+	/**
+	* The particle system's transform is bound as a `u_systemTransform` uniform and
+	* each particle is positioned system-locally, so this renderer never reads the
+	* shared {@link TransformBuffer}; the render-group upload boundary skips writing
+	* transform records for particle draws.
+	* @internal
+	*/
+	_consumesSharedTransform = false;
+	/** Particles the GL-side vertex store is pre-sized for. A hint, not a limit. */
+	_batchSize;
+	_resources = /* @__PURE__ */ new Map();
+	/**
+	* Materials this renderer already registered a dispose listener on.
+	*
+	* `Material` has no unsubscribe, and a disconnect clears {@link _resources}
+	* without clearing the material's callback set - so registering on every
+	* resource creation would leave one dead closure per material behind on
+	* every device-loss/reconnect cycle. The listener stays valid across those
+	* cycles (it resolves the entry through the map when it fires), so it is
+	* registered once and this set remembers that. Weak, so a material dropped
+	* without `destroy()` stays collectable.
+	*/
+	_disposeListenerRegistered = /* @__PURE__ */ new WeakSet();
+	_drawCount = 0;
+	_pendingMode = null;
+	_pendingResources = null;
+	_currentTexture = null;
+	_currentBlendMode = null;
+	_connection = null;
+	constructor(batchSize) {
+		super();
+		this._batchSize = batchSize;
+	}
+	render(system) {
+		const backend = this.getBackend();
+		const { texture, blendMode } = system;
+		const textureChanged = texture !== this._currentTexture;
+		const blendModeChanged = blendMode !== this._currentBlendMode;
+		this.flush();
+		if (textureChanged) {
+			this._currentTexture = texture;
+			backend.bindTexture(texture);
+		}
+		if (blendModeChanged) {
+			this._currentBlendMode = blendMode;
+			backend.setBlendMode(blendMode);
+		}
+		const mode = system.renderMode;
+		const resources = this._getOrCreateResources(mode);
+		const shader = resources.shader;
+		if (shader.uniforms.has("u_systemTransform")) shader.getUniform("u_systemTransform").setValue(system.getGlobalTransform().toArray(false));
+		if (shader.uniforms.has("u_localBounds")) shader.getUniform("u_localBounds").setValue(system.vertices);
+		mode.build(system, system._storage);
+		this._pendingMode = mode;
+		this._pendingResources = resources;
+		this._drawCount = mode.count;
+		return this;
+	}
+	flush() {
+		const backend = this.getBackendOrNull();
+		const mode = this._pendingMode;
+		const resources = this._pendingResources;
+		if (this._drawCount === 0 || backend === null || mode === null || resources === null) return;
+		const view = backend.view;
+		if (resources.view !== view || resources.viewId !== view.updateId) {
+			resources.view = view;
+			resources.viewId = view.updateId;
+			if (resources.shader.uniforms.has("u_projection")) resources.shader.getUniform("u_projection").setValue(view.getTransform().toArray(false));
+		}
+		resources.shader.sync();
+		backend.bindVertexArrayObject(resources.vao);
+		const meshGeometry = mode.vertexGeometry;
+		if (meshGeometry !== null && resources.meshBuffer !== null && resources.meshVersion !== meshGeometry.version) {
+			resources.meshVersion = meshGeometry.version;
+			resources.meshBuffer.upload(meshGeometry.vertexData);
+		}
+		resources.vertexBuffer.upload(this._resolveUploadSource(mode, resources), 0, this._drawCount * resources.stride);
+		const sampler = mode.material.sampler;
+		if (sampler !== null) backend.bindMaterialSampler(sampler, 0);
+		if (resources.instanced) resources.vao.drawInstanced(resources.indexCount, 0, this._drawCount, resources.primitive);
+		else resources.vao.draw(resources.indexBuffer !== null ? resources.indexCount : this._drawCount, 0, resources.primitive);
+		if (sampler !== null) backend.unbindMaterialSampler(0);
+		backend.stats.batches++;
+		backend.stats.drawCalls++;
+		this._drawCount = 0;
+		this._pendingMode = null;
+		this._pendingResources = null;
+	}
+	onConnect(backend) {
+		this._connection = {
+			gl: backend.context,
+			buffers: /* @__PURE__ */ new Map()
+		};
+	}
+	onDisconnect() {
+		for (const resources of this._resources.values()) this._destroyResources(resources);
+		this._resources.clear();
+		this._connection = null;
+		this._currentTexture = null;
+		this._currentBlendMode = null;
+		this._drawCount = 0;
+		this._pendingMode = null;
+		this._pendingResources = null;
+	}
+	destroy() {
+		this.disconnect();
+	}
+	/**
+	* The mode's scratch buffer as bytes. The view is cached and only rebuilt
+	* when the mode swaps in a larger backing buffer; how much of it this draw
+	* uploads is expressed as an element count at the upload call, so a steady
+	* frame allocates nothing at all.
+	*/
+	_resolveUploadSource(mode, resources) {
+		const data = mode.data;
+		if (resources.source !== data) {
+			resources.source = data;
+			resources.bytes = new Uint8Array(data);
+		}
+		return resources.bytes;
+	}
+	_getOrCreateResources(mode) {
+		const connection = this._connection;
+		if (connection === null) throw new Error("WebGl2ParticleRenderer is not connected to a backend.");
+		const material = mode.material;
+		const cached = this._resources.get(material);
+		if (cached !== void 0) return cached;
+		const created = this._createResources(mode, material, connection);
+		this._resources.set(material, created);
+		if (!this._disposeListenerRegistered.has(material)) {
+			this._disposeListenerRegistered.add(material);
+			material._onDispose(() => {
+				this._disposeListenerRegistered.delete(material);
+				const stored = this._resources.get(material);
+				if (stored === void 0) return;
+				if (this._pendingResources === stored) {
+					this._drawCount = 0;
+					this._pendingMode = null;
+					this._pendingResources = null;
+				}
+				this._destroyResources(stored);
+				this._resources.delete(material);
+			});
+		}
+		return created;
+	}
+	_createResources(mode, material, connection) {
+		const gl = connection.gl;
+		const glsl = material.shader.glsl;
+		if (glsl === null) throw new Error("Particle material shader has no `glsl` source; cannot render through the WebGL2 backend.");
+		const layout = mode.dataLayout;
+		const meshGeometry = mode.vertexGeometry;
+		assertVertexGeometryCompatible(layout, meshGeometry, mode.instanced, mode.constructor.name);
+		const shader = new Shader(glsl.vertex, glsl.fragment);
+		shader.connect(createWebGl2ShaderProgram(gl));
+		shader.sync();
+		const indices = meshGeometry !== null ? meshGeometry.indices : layout.indices;
+		const topology = meshGeometry !== null ? meshGeometry.topology : layout.topology;
+		const indexCount = meshGeometry !== null ? meshGeometry.indexCount : layout.indexCount;
+		const indexBuffer = indices !== null ? new WebGl2RenderBuffer(BufferTypes.ElementArrayBuffer, indices, BufferUsage.StaticDraw).connect(this._createBufferRuntime(connection)) : null;
+		const vertexBuffer = new WebGl2RenderBuffer(BufferTypes.ArrayBuffer, new ArrayBuffer(this._batchSize * layout.stride), usageByGeometryUsage[layout.usage]).connect(this._createBufferRuntime(connection));
+		const meshBuffer = meshGeometry !== null ? new WebGl2RenderBuffer(BufferTypes.ArrayBuffer, meshGeometry.vertexData, usageByGeometryUsage[meshGeometry.usage]).connect(this._createBufferRuntime(connection)) : null;
+		const vaoHandle = gl.createVertexArray();
+		if (vaoHandle === null) throw new Error("WebGl2ParticleRenderer: could not create vertex array object.");
+		const divisor = mode.instanced ? 1 : 0;
+		const vao = new WebGl2VertexArrayObject();
+		if (indexBuffer !== null) vao.addIndex(indexBuffer);
+		for (const attribute of layout.attributes) vao.addAttribute(vertexBuffer, shader.getAttribute(attribute.name), resolveAttributeType(gl, attribute.type), attribute.normalized, layout.stride, attribute.offset, !attribute.normalized && integerAttributeTypes.has(attribute.type), divisor);
+		if (meshGeometry !== null && meshBuffer !== null) for (const attribute of meshGeometry.attributes) vao.addAttribute(meshBuffer, shader.getAttribute(attribute.name), resolveAttributeType(gl, attribute.type), attribute.normalized, meshGeometry.stride, attribute.offset, !attribute.normalized && integerAttributeTypes.has(attribute.type), 0);
+		vao.connect(this._createVaoRuntime(connection, vaoHandle, indices instanceof Uint32Array ? gl.UNSIGNED_INT : gl.UNSIGNED_SHORT));
+		return {
+			shader,
+			vao,
+			vertexBuffer,
+			meshBuffer,
+			meshVersion: meshGeometry?.version ?? -1,
+			indexBuffer,
+			stride: layout.stride,
+			primitive: resolvePrimitive(topology),
+			instanced: mode.instanced,
+			indexCount,
+			bytes: /* @__PURE__ */ new Uint8Array(0),
+			source: null,
+			view: null,
+			viewId: -1
+		};
+	}
+	_destroyResources(resources) {
+		resources.vao.destroy();
+		resources.vertexBuffer.destroy();
+		resources.meshBuffer?.destroy();
+		resources.indexBuffer?.destroy();
+		resources.shader.destroy();
+	}
+	_createBufferRuntime(connection) {
+		const handle = connection.gl.createBuffer();
+		if (handle === null) throw new Error("WebGl2ParticleRenderer: could not create render buffer.");
+		return {
+			bind: (buffer) => {
+				connection.gl.bindBuffer(buffer.type, handle);
+			},
+			upload: (buffer, offset) => {
+				const gl = connection.gl;
+				const state = connection.buffers.get(buffer);
+				gl.bindBuffer(buffer.type, handle);
+				if (state && state.dataByteLength >= buffer.uploadByteLength) {
+					uploadBufferRange(gl, buffer, offset);
+					state.dataByteLength = buffer.uploadByteLength;
+				} else {
+					uploadBufferStore(gl, buffer);
+					connection.buffers.set(buffer, {
+						handle,
+						dataByteLength: buffer.uploadByteLength
+					});
+				}
+			},
+			destroy: (buffer) => {
+				connection.gl.deleteBuffer(handle);
+				connection.buffers.delete(buffer);
+				buffer.disconnect();
+			}
+		};
+	}
+	_createVaoRuntime(connection, vaoHandle, indexType) {
+		let appliedVersion = -1;
+		return {
+			bind: (vao) => {
+				const gl = connection.gl;
+				gl.bindVertexArray(vaoHandle);
+				if (appliedVersion !== vao.version) {
+					let lastBuffer = null;
+					for (const attribute of vao.attributes) {
+						if (lastBuffer !== attribute.buffer) {
+							attribute.buffer.bind();
+							lastBuffer = attribute.buffer;
+						}
+						if (attribute.integer) gl.vertexAttribIPointer(attribute.location, attribute.size, attribute.type, attribute.stride, attribute.start);
+						else gl.vertexAttribPointer(attribute.location, attribute.size, attribute.type, attribute.normalized, attribute.stride, attribute.start);
+						gl.enableVertexAttribArray(attribute.location);
+						gl.vertexAttribDivisor(attribute.location, attribute.divisor);
+					}
+					if (vao.indexBuffer) vao.indexBuffer.bind();
+					appliedVersion = vao.version;
+				}
+			},
+			unbind: () => {
+				connection.gl.bindVertexArray(null);
+			},
+			draw: (vao, size, start, type) => {
+				const gl = connection.gl;
+				if (vao.indexBuffer) gl.drawElements(type, size, indexType, start);
+				else gl.drawArrays(type, start, size);
+			},
+			drawInstanced: (vao, count, start, instanceCount, type) => {
+				const gl = connection.gl;
+				if (vao.indexBuffer) gl.drawElementsInstanced(type, count, indexType, start, instanceCount);
+				else gl.drawArraysInstanced(type, start, count, instanceCount);
+			},
+			destroy: (vao) => {
+				connection.gl.deleteVertexArray(vaoHandle);
+				vao.disconnect();
+			}
+		};
+	}
+};
 
+//#endregion
 export { WebGl2ParticleRenderer };
-//# sourceMappingURL=WebGl2ParticleRenderer.js.map
+//# sourceMappingURL=WebGl2ParticleRenderer.js.map