@plastic-software/three 0.183.3 → 0.184.0

package/src/renderers/webgpu/WebGPUBackend.js

@@ -10,12 +10,15 @@ import Backend from '../common/Backend.js';
 import WebGPUUtils from './utils/WebGPUUtils.js';
 import WebGPUAttributeUtils from './utils/WebGPUAttributeUtils.js';
 import WebGPUBindingUtils from './utils/WebGPUBindingUtils.js';
+import WebGPUCapabilities from './utils/WebGPUCapabilities.js';
 import WebGPUPipelineUtils from './utils/WebGPUPipelineUtils.js';
 import WebGPUTextureUtils from './utils/WebGPUTextureUtils.js';
 
 import { WebGPUCoordinateSystem, TimestampQuery, REVISION, HalfFloatType, Compatibility } from '../../constants.js';
 import WebGPUTimestampQueryPool from './utils/WebGPUTimestampQueryPool.js';
-import { warnOnce, error } from '../../utils.js';
+import { error } from '../../utils.js';
+
+const _clearValue = { r: 0, g: 0, b: 0, a: 1 };
 
 /**
  * A backend implementation targeting WebGPU.
@@ -116,6 +119,14 @@ class WebGPUBackend extends Backend {
 		 */
 		this.bindingUtils = new WebGPUBindingUtils( this );
 
+		/**
+		 * A reference to a backend module holding device capability related
+		 * utility functions.
+		 *
+		 * @type {WebGPUCapabilities}
+		 */
+		this.capabilities = new WebGPUCapabilities( this );
+
 		/**
 		 * A reference to a backend module holding shader pipeline-related
 		 * utility functions.
@@ -314,15 +325,20 @@ class WebGPUBackend extends Backend {
 
 	/**
 	 * This method performs a readback operation by moving buffer data from
-	 * a storage buffer attribute from the GPU to the CPU.
+	 * a storage buffer attribute from the GPU to the CPU. ReadbackBuffer can
+	 * be used to retain and reuse handles to the intermediate buffers and prevent
+	 * new allocation.
 	 *
 	 * @async
-	 * @param {StorageBufferAttribute} attribute - The storage buffer attribute.
-	 * @return {Promise<ArrayBuffer>} A promise that resolves with the buffer data when the data are ready.
+	 * @param {BufferAttribute} attribute - The storage buffer attribute to read frm.
+	 * @param {number} count - The offset from which to start reading the
+	 * @param {number} offset - The storage buffer attribute.
+	 * @param {ReadbackBuffer|ArrayBuffer} target - The storage buffer attribute.
+	 * @return {Promise<ArrayBuffer|ReadbackBuffer>} A promise that resolves with the buffer data when the data are ready.
 	 */
-	async getArrayBufferAsync( attribute ) {
+	async getArrayBufferAsync( attribute, target = null, offset = 0, count = - 1 ) {
 
-		return await this.attributeUtils.getArrayBufferAsync( attribute );
+		return await this.attributeUtils.getArrayBufferAsync( attribute, target, offset, count );
 
 	}
 
@@ -673,7 +689,21 @@ class WebGPUBackend extends Backend {
 
 				if ( renderContext.clearColor ) {
 
-					colorAttachment.clearValue = i === 0 ? renderContext.clearColorValue : { r: 0, g: 0, b: 0, a: 1 };
+					if ( i === 0 ) {
+
+						colorAttachment.clearValue = renderContext.clearColorValue;
+
+					} else {
+
+						_clearValue.r = 0;
+						_clearValue.g = 0;
+						_clearValue.b = 0;
+						_clearValue.a = 1;
+
+						colorAttachment.clearValue = _clearValue;
+
+					}
+
 					colorAttachment.loadOp = GPULoadOp.Clear;
 
 				} else {
@@ -1215,7 +1245,6 @@ class WebGPUBackend extends Backend {
 
 		let colorAttachments = [];
 		let depthStencilAttachment;
-		let clearValue;
 
 		let supportsDepth;
 		let supportsStencil;
@@ -1223,7 +1252,11 @@ class WebGPUBackend extends Backend {
 		if ( color ) {
 
 			const clearColor = this.getClearColor();
-			clearValue = { r: clearColor.r, g: clearColor.g, b: clearColor.b, a: clearColor.a };
+
+			_clearValue.r = clearColor.r;
+			_clearValue.g = clearColor.g;
+			_clearValue.b = clearColor.b;
+			_clearValue.a = clearColor.a;
 
 		}
 
@@ -1240,7 +1273,7 @@ class WebGPUBackend extends Backend {
 
 				const colorAttachment = colorAttachments[ 0 ];
 
-				colorAttachment.clearValue = clearValue;
+				colorAttachment.clearValue = _clearValue;
 				colorAttachment.loadOp = GPULoadOp.Clear;
 				colorAttachment.storeOp = GPUStoreOp.Store;
 
@@ -1259,7 +1292,7 @@ class WebGPUBackend extends Backend {
 
 			const clearConfig = {
 				loadOp: color ? GPULoadOp.Clear : GPULoadOp.Load,
-				clearValue: color ? clearValue : undefined
+				clearValue: color ? _clearValue : undefined
 			};
 
 			if ( supportsDepth ) {
@@ -1397,13 +1430,13 @@ class WebGPUBackend extends Backend {
 
 		if ( dispatchSize === null ) {
 
-			dispatchSize = computeNode.count;
+			dispatchSize = computeNode.dispatchSize || computeNode.count;
 
 		}
 
 		// When the dispatchSize is set with a StorageBuffer from the GPU.
 
-		if ( dispatchSize && typeof dispatchSize === 'object' && dispatchSize.isIndirectStorageBufferAttribute ) {
+		if ( dispatchSize && dispatchSize.isIndirectStorageBufferAttribute ) {
 
 			const dispatchBuffer = this.get( dispatchSize ).buffer;
 
@@ -1482,204 +1515,201 @@ class WebGPUBackend extends Backend {
 
 	}
 
-	// render object
-
 	/**
-	 * Executes a draw command for the given render object.
+	 * Internal draw function that performs the draw with the given pass encoder.
 	 *
-	 * @param {RenderObject} renderObject - The render object to draw.
+	 * @private
+	 * @param {RenderObject} renderObject - The render object.
 	 * @param {Info} info - Holds a series of statistical information about the GPU memory and the rendering process.
+	 * @param {Object} renderContextData - The render context data object, holding current pass state and occlusion query tracking.
+	 * @param {GPURenderPipeline} pipelineGPU - The GPU render pipeline.
+	 * @param {Array<BindGroup>} bindings - The bind groups.
+	 * @param {Array<BufferAttribute>} vertexBuffers - The vertex buffers.
+	 * @param {{vertexCount: number, firstVertex: number, instanceCount: number, firstInstance: number}} drawParams - The draw parameters.
+	 * @param {GPURenderPassEncoder|GPURenderBundleEncoder} passEncoderGPU - The GPU pass encoder used for recording draw commands.
+	 * @param {Object} currentSets - Tracking object for currently set pipeline, attributes, bind groups, and index state.
 	 */
-	draw( renderObject, info ) {
-
-		const { object, material, context, pipeline } = renderObject;
-		const bindings = renderObject.getBindings();
-		const renderContextData = this.get( context );
-		const pipelineData = this.get( pipeline );
-		const pipelineGPU = pipelineData.pipeline;
+	_draw( renderObject, info, renderContextData, pipelineGPU, bindings, vertexBuffers, drawParams, passEncoderGPU, currentSets ) {
 
-		if ( pipelineData.error === true ) return;
+		const { object, material, context } = renderObject;
 
 		const index = renderObject.getIndex();
 		const hasIndex = ( index !== null );
 
-
-		const drawParams = renderObject.getDrawParameters();
-		if ( drawParams === null ) return;
-
 		// pipeline
+		this.pipelineUtils.setPipeline( passEncoderGPU, pipelineGPU );
+		currentSets.pipeline = pipelineGPU;
 
-		const setPipelineAndBindings = ( passEncoderGPU, currentSets ) => {
-
-			// pipeline
-			this.pipelineUtils.setPipeline( passEncoderGPU, pipelineGPU );
-			currentSets.pipeline = pipelineGPU;
-
-			// bind groups
-			const currentBindingGroups = currentSets.bindingGroups;
-			for ( let i = 0, l = bindings.length; i < l; i ++ ) {
-
-				const bindGroup = bindings[ i ];
-				const bindingsData = this.get( bindGroup );
-				if ( currentBindingGroups[ bindGroup.index ] !== bindGroup.id ) {
+		// bind groups
+		const currentBindingGroups = currentSets.bindingGroups;
+		for ( let i = 0, l = bindings.length; i < l; i ++ ) {
 
-					passEncoderGPU.setBindGroup( bindGroup.index, bindingsData.group );
-					currentBindingGroups[ bindGroup.index ] = bindGroup.id;
+			const bindGroup = bindings[ i ];
+			const bindingsData = this.get( bindGroup );
+			if ( currentBindingGroups[ i ] !== bindGroup.id ) {
 
-				}
+				passEncoderGPU.setBindGroup( i, bindingsData.group );
+				currentBindingGroups[ i ] = bindGroup.id;
 
 			}
 
-			// attributes
+		}
 
-			// index
+		// attributes
 
-			if ( hasIndex === true ) {
+		// index
 
-				if ( currentSets.index !== index ) {
+		if ( hasIndex === true ) {
 
-					const buffer = this.get( index ).buffer;
-					const indexFormat = ( index.array instanceof Uint16Array ) ? GPUIndexFormat.Uint16 : GPUIndexFormat.Uint32;
+			if ( currentSets.index !== index ) {
 
-					passEncoderGPU.setIndexBuffer( buffer, indexFormat );
+				const buffer = this.get( index ).buffer;
+				const indexFormat = ( index.array instanceof Uint16Array ) ? GPUIndexFormat.Uint16 : GPUIndexFormat.Uint32;
 
-					currentSets.index = index;
+				passEncoderGPU.setIndexBuffer( buffer, indexFormat );
 
-				}
+				currentSets.index = index;
 
 			}
-			// vertex buffers
-
-			const vertexBuffers = renderObject.getVertexBuffers();
 
-			for ( let i = 0, l = vertexBuffers.length; i < l; i ++ ) {
+		}
 
-				const vertexBuffer = vertexBuffers[ i ];
+		for ( let i = 0, l = vertexBuffers.length; i < l; i ++ ) {
 
-				if ( currentSets.attributes[ i ] !== vertexBuffer ) {
+			const vertexBuffer = vertexBuffers[ i ];
 
-					const buffer = this.get( vertexBuffer ).buffer;
-					passEncoderGPU.setVertexBuffer( i, buffer );
+			if ( currentSets.attributes[ i ] !== vertexBuffer ) {
 
-					currentSets.attributes[ i ] = vertexBuffer;
+				const buffer = this.get( vertexBuffer ).buffer;
+				passEncoderGPU.setVertexBuffer( i, buffer );
 
-				}
+				currentSets.attributes[ i ] = vertexBuffer;
 
 			}
-			// stencil
 
-			if ( context.stencil === true && material.stencilWrite === true && renderContextData.currentStencilRef !== material.stencilRef ) {
+		}
+		// stencil
 
-				passEncoderGPU.setStencilReference( material.stencilRef );
-				renderContextData.currentStencilRef = material.stencilRef;
+		if ( context.stencil === true && material.stencilWrite === true && renderContextData.currentStencilRef !== material.stencilRef ) {
 
-			}
+			passEncoderGPU.setStencilReference( material.stencilRef );
+			renderContextData.currentStencilRef = material.stencilRef;
 
+		}
 
-		};
+		if ( object.isBatchedMesh === true ) {
 
-		// Define draw function
-		const draw = ( passEncoderGPU, currentSets ) => {
+			const starts = object._multiDrawStarts;
+			const counts = object._multiDrawCounts;
+			const drawCount = object._multiDrawCount;
 
-			setPipelineAndBindings( passEncoderGPU, currentSets );
+			let bytesPerElement = ( hasIndex === true ) ? index.array.BYTES_PER_ELEMENT : 1;
 
-			if ( object.isBatchedMesh === true ) {
+			if ( material.wireframe ) {
 
-				const starts = object._multiDrawStarts;
-				const counts = object._multiDrawCounts;
-				const drawCount = object._multiDrawCount;
-				const drawInstances = object._multiDrawInstances;
+				bytesPerElement = object.geometry.attributes.position.count > 65535 ? 4 : 2;
 
-				if ( drawInstances !== null ) {
+			}
 
-					// @deprecated, r174
-					warnOnce( 'WebGPUBackend: renderMultiDrawInstances has been deprecated and will be removed in r184. Append to renderMultiDraw arguments and use indirection.' );
+			for ( let i = 0; i < drawCount; i ++ ) {
 
-				}
+				if ( hasIndex === true ) {
 
-				let bytesPerElement = ( hasIndex === true ) ? index.array.BYTES_PER_ELEMENT : 1;
+					passEncoderGPU.drawIndexed( counts[ i ], 1, starts[ i ] / bytesPerElement, 0, i );
 
-				if ( material.wireframe ) {
+				} else {
 
-					bytesPerElement = object.geometry.attributes.position.count > 65535 ? 4 : 2;
+					passEncoderGPU.draw( counts[ i ], 1, starts[ i ], i );
 
 				}
 
-				for ( let i = 0; i < drawCount; i ++ ) {
+				info.update( object, counts[ i ], 1 );
 
-					const count = drawInstances ? drawInstances[ i ] : 1;
-					const firstInstance = count > 1 ? 0 : i;
+			}
 
-					if ( hasIndex === true ) {
+		} else if ( hasIndex === true ) {
 
-						passEncoderGPU.drawIndexed( counts[ i ], count, starts[ i ] / bytesPerElement, 0, firstInstance );
+			const { vertexCount: indexCount, instanceCount, firstVertex: firstIndex } = drawParams;
 
-					} else {
+			const indirect = renderObject.getIndirect();
 
-						passEncoderGPU.draw( counts[ i ], count, starts[ i ], firstInstance );
+			if ( indirect !== null ) {
 
-					}
+				const buffer = this.get( indirect ).buffer;
+				const indirectOffset = renderObject.getIndirectOffset();
+				const indirectOffsets = Array.isArray( indirectOffset ) ? indirectOffset : [ indirectOffset ];
+
+				for ( let i = 0; i < indirectOffsets.length; i ++ ) {
 
-					info.update( object, counts[ i ], count );
+					passEncoderGPU.drawIndexedIndirect( buffer, indirectOffsets[ i ] );
 
 				}
 
-			} else if ( hasIndex === true ) {
+			} else {
+
+				passEncoderGPU.drawIndexed( indexCount, instanceCount, firstIndex, 0, 0 );
 
-				const { vertexCount: indexCount, instanceCount, firstVertex: firstIndex } = drawParams;
+			}
 
-				const indirect = renderObject.getIndirect();
+			info.update( object, indexCount, instanceCount );
 
-				if ( indirect !== null ) {
+		} else {
 
-					const buffer = this.get( indirect ).buffer;
-					const indirectOffset = renderObject.getIndirectOffset();
-					const indirectOffsets = Array.isArray( indirectOffset ) ? indirectOffset : [ indirectOffset ];
+			const { vertexCount, instanceCount, firstVertex } = drawParams;
 
-					for ( let i = 0; i < indirectOffsets.length; i ++ ) {
+			const indirect = renderObject.getIndirect();
 
-						passEncoderGPU.drawIndexedIndirect( buffer, indirectOffsets[ i ] );
+			if ( indirect !== null ) {
 
-					}
+				const buffer = this.get( indirect ).buffer;
+				const indirectOffset = renderObject.getIndirectOffset();
+				const indirectOffsets = Array.isArray( indirectOffset ) ? indirectOffset : [ indirectOffset ];
 
-				} else {
+				for ( let i = 0; i < indirectOffsets.length; i ++ ) {
 
-					passEncoderGPU.drawIndexed( indexCount, instanceCount, firstIndex, 0, 0 );
+					passEncoderGPU.drawIndirect( buffer, indirectOffsets[ i ] );
 
 				}
 
-				info.update( object, indexCount, instanceCount );
 
 			} else {
 
-				const { vertexCount, instanceCount, firstVertex } = drawParams;
+				passEncoderGPU.draw( vertexCount, instanceCount, firstVertex, 0 );
 
-				const indirect = renderObject.getIndirect();
-
-				if ( indirect !== null ) {
+			}
 
-					const buffer = this.get( indirect ).buffer;
-					const indirectOffset = renderObject.getIndirectOffset();
-					const indirectOffsets = Array.isArray( indirectOffset ) ? indirectOffset : [ indirectOffset ];
+			info.update( object, vertexCount, instanceCount );
 
-					for ( let i = 0; i < indirectOffsets.length; i ++ ) {
+		}
 
-						passEncoderGPU.drawIndirect( buffer, indirectOffsets[ i ] );
+	}
 
-					}
+	// render object
 
+	/**
+	 * Executes a draw command for the given render object.
+	 *
+	 * @param {RenderObject} renderObject - The render object to draw.
+	 * @param {Info} info - Holds a series of statistical information about the GPU memory and the rendering process.
+	 */
+	draw( renderObject, info ) {
 
-				} else {
+		const { object, context, pipeline } = renderObject;
+		const renderContextData = this.get( context );
+		const pipelineData = this.get( pipeline );
+		const pipelineGPU = pipelineData.pipeline;
 
-					passEncoderGPU.draw( vertexCount, instanceCount, firstVertex, 0 );
+		// Skip if pipeline has error
+		if ( pipelineData.error === true ) return;
 
-				}
+		const drawParams = renderObject.getDrawParameters();
+		if ( drawParams === null ) return;
 
-				info.update( object, vertexCount, instanceCount );
+		const bindings = renderObject.getBindings();
 
-			}
+		// vertex buffers
 
-		};
+		const vertexBuffers = renderObject.getVertexBuffers();
 
 		if ( renderObject.camera.isArrayCamera && renderObject.camera.cameras.length > 0 ) {
 
@@ -1720,8 +1750,6 @@ class WebGPUBackend extends Backend {
 
 					const vp = subCamera.viewport;
 
-
-
 					let pass = renderContextData.currentPass;
 					let sets = renderContextData.currentSets;
 					if ( renderContextData.bundleEncoders ) {
@@ -1733,8 +1761,6 @@ class WebGPUBackend extends Backend {
 
 					}
 
-
-
 					if ( vp ) {
 
 						pass.setViewport(
@@ -1748,17 +1774,16 @@ class WebGPUBackend extends Backend {
 
 					}
 
-
 					// Set camera index binding for this layer
 					if ( cameraIndex && cameraData.indexesGPU ) {
 
-						pass.setBindGroup( cameraIndex.index, cameraData.indexesGPU[ i ] );
-						sets.bindingGroups[ cameraIndex.index ] = cameraIndex.id;
+						const indexPos = bindings.indexOf( cameraIndex );
+						pass.setBindGroup( indexPos, cameraData.indexesGPU[ i ] );
+						sets.bindingGroups[ indexPos ] = cameraIndex.id;
 
 					}
 
-					draw( pass, sets );
-
+					this._draw( renderObject, info, renderContextData, pipelineGPU, bindings, vertexBuffers, drawParams, pass, sets );
 
 				}
 
@@ -1795,7 +1820,7 @@ class WebGPUBackend extends Backend {
 
 				}
 
-				draw( renderContextData.currentPass, renderContextData.currentSets );
+				this._draw( renderObject, info, renderContextData, pipelineGPU, bindings, vertexBuffers, drawParams, renderContextData.currentPass, renderContextData.currentSets );
 
 			}
 
@@ -2292,17 +2317,6 @@ class WebGPUBackend extends Backend {
 
 	// utils public
 
-	/**
-	 * Returns the maximum anisotropy texture filtering value.
-	 *
-	 * @return {number} The maximum anisotropy texture filtering value.
-	 */
-	getMaxAnisotropy() {
-
-		return 16;
-
-	}
-
 	/**
 	 * Checks if the given feature is supported by the backend.
 	 *
@@ -2538,9 +2552,9 @@ class WebGPUBackend extends Backend {
 	 */
 	hasCompatibility( name ) {
 
-		if ( this._compatibility[ Compatibility.TEXTURE_COMPARE ] !== undefined ) {
+		if ( this._compatibility[ name ] !== undefined ) {
 
-			return this._compatibility[ Compatibility.TEXTURE_COMPARE ];
+			return this._compatibility[ name ];
 
 		}