@plastic-software/three 0.174.0 → 0.175.0

package/src/renderers/webgl-fallback/nodes/GLSLNodeBuilder.js

@@ -79,7 +79,7 @@ class GLSLNodeBuilder extends NodeBuilder {
 		 * An array that holds objects defining the varying and attribute data in
 		 * context of Transform Feedback.
 		 *
-		 * @type {Object<string,Map<string,Object>>}
+		 * @type {Array<Object<string,AttributeNode|string>>}
 		 */
 		this.transforms = [];
 
@@ -97,14 +97,6 @@ class GLSLNodeBuilder extends NodeBuilder {
 		 */
 		this.builtins = { vertex: [], fragment: [], compute: [] };
 
-		/**
-		 * Whether comparison in shader code are generated with methods or not.
-		 *
-		 * @type {boolean}
-		 * @default true
-		 */
-		this.useComparisonMethod = true;
-
 	}
 
 	/**
@@ -775,7 +767,7 @@ ${ flowData.code }
 
 					const flat = type.includes( 'int' ) || type.includes( 'uv' ) || type.includes( 'iv' ) ? 'flat ' : '';
 
-					snippet += `${flat} out ${type} ${varying.name};\n`;
+					snippet += `${flat}out ${type} ${varying.name};\n`;
 
 				} else {
 
@@ -1073,10 +1065,9 @@ ${ flowData.code }
 		for ( let i = 0; i < transforms.length; i ++ ) {
 
 			const transform = transforms[ i ];
-
 			const attributeName = this.getPropertyName( transform.attributeNode );
 
-			snippet += `${ transform.varyingName } = ${ attributeName };\n\t`;
+			if ( attributeName ) snippet += `${ transform.varyingName } = ${ attributeName };\n\t`;
 
 		}
 

package/src/renderers/webgl-fallback/utils/WebGLTextureUtils.js

@@ -697,33 +697,57 @@ class WebGLTextureUtils {
 	 *
 	 * @param {Texture} srcTexture - The source texture.
 	 * @param {Texture} dstTexture - The destination texture.
-	 * @param {?Vector4} [srcRegion=null] - The region of the source texture to copy.
+	 * @param {?(Box3|Box2)} [srcRegion=null] - The region of the source texture to copy.
 	 * @param {?(Vector2|Vector3)} [dstPosition=null] - The destination position of the copy.
-	 * @param {number} [level=0] - The mip level to copy.
+	 * @param {number} [srcLevel=0] - The source mip level to copy from.
+	 * @param {number} [dstLevel=0] - The destination mip level to copy to.
 	 */
-	copyTextureToTexture( srcTexture, dstTexture, srcRegion = null, dstPosition = null, level = 0 ) {
+	copyTextureToTexture( srcTexture, dstTexture, srcRegion = null, dstPosition = null, srcLevel = 0, dstLevel = 0 ) {
 
 		const { gl, backend } = this;
 		const { state } = this.backend;
 
 		const { textureGPU: dstTextureGPU, glTextureType, glType, glFormat } = backend.get( dstTexture );
 
-		let width, height, minX, minY;
-		let dstX, dstY;
+		state.bindTexture( glTextureType, dstTextureGPU );
+
+		// gather the necessary dimensions to copy
+		let width, height, depth, minX, minY, minZ;
+		let dstX, dstY, dstZ;
+		const image = srcTexture.isCompressedTexture ? srcTexture.mipmaps[ dstLevel ] : srcTexture.image;
 
 		if ( srcRegion !== null ) {
 
 			width = srcRegion.max.x - srcRegion.min.x;
 			height = srcRegion.max.y - srcRegion.min.y;
+			depth = srcRegion.isBox3 ? srcRegion.max.z - srcRegion.min.z : 1;
 			minX = srcRegion.min.x;
 			minY = srcRegion.min.y;
+			minZ = srcRegion.isBox3 ? srcRegion.min.z : 0;
 
 		} else {
 
-			width = srcTexture.image.width;
-			height = srcTexture.image.height;
+			const levelScale = Math.pow( 2, - srcLevel );
+			width = Math.floor( image.width * levelScale );
+			height = Math.floor( image.height * levelScale );
+
+			if ( srcTexture.isDataArrayTexture ) {
+
+				depth = image.depth;
+
+			} else if ( srcTexture.isData3DTexture ) {
+
+				depth = Math.floor( image.depth * levelScale );
+
+			} else {
+
+				depth = 1;
+
+			}
+
 			minX = 0;
 			minY = 0;
+			minZ = 0;
 
 		}
 
@@ -731,36 +755,36 @@ class WebGLTextureUtils {
 
 			dstX = dstPosition.x;
 			dstY = dstPosition.y;
+			dstZ = dstPosition.z;
 
 		} else {
 
 			dstX = 0;
 			dstY = 0;
+			dstZ = 0;
 
 		}
 
-		state.bindTexture( glTextureType, dstTextureGPU );
 
-		// As another texture upload may have changed pixelStorei
-		// parameters, make sure they are correct for the dstTexture
-		gl.pixelStorei( gl.UNPACK_ALIGNMENT, dstTexture.unpackAlignment );
 		gl.pixelStorei( gl.UNPACK_FLIP_Y_WEBGL, dstTexture.flipY );
 		gl.pixelStorei( gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, dstTexture.premultiplyAlpha );
 		gl.pixelStorei( gl.UNPACK_ALIGNMENT, dstTexture.unpackAlignment );
 
+		// used for copying data from cpu
 		const currentUnpackRowLen = gl.getParameter( gl.UNPACK_ROW_LENGTH );
 		const currentUnpackImageHeight = gl.getParameter( gl.UNPACK_IMAGE_HEIGHT );
 		const currentUnpackSkipPixels = gl.getParameter( gl.UNPACK_SKIP_PIXELS );
 		const currentUnpackSkipRows = gl.getParameter( gl.UNPACK_SKIP_ROWS );
 		const currentUnpackSkipImages = gl.getParameter( gl.UNPACK_SKIP_IMAGES );
 
-		const image = srcTexture.isCompressedTexture ? srcTexture.mipmaps[ level ] : srcTexture.image;
-
 		gl.pixelStorei( gl.UNPACK_ROW_LENGTH, image.width );
 		gl.pixelStorei( gl.UNPACK_IMAGE_HEIGHT, image.height );
 		gl.pixelStorei( gl.UNPACK_SKIP_PIXELS, minX );
 		gl.pixelStorei( gl.UNPACK_SKIP_ROWS, minY );
+		gl.pixelStorei( gl.UNPACK_SKIP_IMAGES, minZ );
 
+		// set up the src texture
+		const isDst3D = dstTexture.isDataArrayTexture || dstTexture.isData3DTexture;
 		if ( srcTexture.isRenderTargetTexture || srcTexture.isDepthTexture ) {
 
 			const srcTextureData = backend.get( srcTexture );
@@ -786,19 +810,37 @@ class WebGLTextureUtils {
 
 		} else {
 
-			if ( srcTexture.isDataTexture ) {
+			if ( isDst3D ) {
 
-				gl.texSubImage2D( gl.TEXTURE_2D, level, dstX, dstY, width, height, glFormat, glType, image.data );
+				// copy data into the 3d texture
+				if ( srcTexture.isDataTexture || srcTexture.isData3DTexture ) {
+
+					gl.texSubImage3D( glTextureType, dstLevel, dstX, dstY, dstZ, width, height, depth, glFormat, glType, image.data );
+
+				} else if ( dstTexture.isCompressedArrayTexture ) {
+
+					gl.compressedTexSubImage3D( glTextureType, dstLevel, dstX, dstY, dstZ, width, height, depth, glFormat, image.data );
+
+				} else {
+
+					gl.texSubImage3D( glTextureType, dstLevel, dstX, dstY, dstZ, width, height, depth, glFormat, glType, image );
+
+				}
 
 			} else {
 
-				if ( srcTexture.isCompressedTexture ) {
+				// copy data into the 2d texture
+				if ( srcTexture.isDataTexture ) {
+
+					gl.texSubImage2D( glTextureType, dstLevel, dstX, dstY, width, height, glFormat, glType, image.data );
 
-					gl.compressedTexSubImage2D( gl.TEXTURE_2D, level, dstX, dstY, image.width, image.height, glFormat, image.data );
+				} else if ( srcTexture.isCompressedTexture ) {
+
+					gl.compressedTexSubImage2D( glTextureType, dstLevel, dstX, dstY, image.width, image.height, glFormat, image.data );
 
 				} else {
 
-					gl.texSubImage2D( gl.TEXTURE_2D, level, dstX, dstY, width, height, glFormat, glType, image );
+					gl.texSubImage2D( glTextureType, dstLevel, dstX, dstY, width, height, glFormat, glType, image );
 
 				}
 
@@ -806,6 +848,7 @@ class WebGLTextureUtils {
 
 		}
 
+		// reset values
 		gl.pixelStorei( gl.UNPACK_ROW_LENGTH, currentUnpackRowLen );
 		gl.pixelStorei( gl.UNPACK_IMAGE_HEIGHT, currentUnpackImageHeight );
 		gl.pixelStorei( gl.UNPACK_SKIP_PIXELS, currentUnpackSkipPixels );
@@ -813,12 +856,17 @@ class WebGLTextureUtils {
 		gl.pixelStorei( gl.UNPACK_SKIP_IMAGES, currentUnpackSkipImages );
 
 		// Generate mipmaps only when copying level 0
-		if ( level === 0 && dstTexture.generateMipmaps ) gl.generateMipmap( gl.TEXTURE_2D );
+		if ( dstLevel === 0 && dstTexture.generateMipmaps ) {
+
+			gl.generateMipmap( glTextureType );
+
+		}
 
 		state.unbindTexture();
 
 	}
 
+
 	/**
 	 * Copies the current bound framebuffer to the given texture.
 	 *

package/src/renderers/webgl-fallback/utils/WebGLUtils.js

@@ -45,7 +45,7 @@ class WebGLUtils {
 	 *
 	 * @param {number} p - The three.js constant.
 	 * @param {string} [colorSpace=NoColorSpace] - The color space.
-	 * @return {number} The corresponding WebGL constant.
+	 * @return {?number} The corresponding WebGL constant.
 	 */
 	convert( p, colorSpace = NoColorSpace ) {
 

package/src/renderers/webgpu/WebGPUBackend.js

@@ -25,22 +25,28 @@ import { warnOnce } from '../../utils.js';
  */
 class WebGPUBackend extends Backend {
 
+	/**
+	 * WebGPUBackend options.
+	 *
+	 * @typedef {Object} WebGPUBackend~Options
+	 * @property {boolean} [logarithmicDepthBuffer=false] - Whether logarithmic depth buffer is enabled or not.
+	 * @property {boolean} [alpha=true] - Whether the default framebuffer (which represents the final contents of the canvas) should be transparent or opaque.
+	 * @property {boolean} [depth=true] - Whether the default framebuffer should have a depth buffer or not.
+	 * @property {boolean} [stencil=false] - Whether the default framebuffer should have a stencil buffer or not.
+	 * @property {boolean} [antialias=false] - Whether MSAA as the default anti-aliasing should be enabled or not.
+	 * @property {number} [samples=0] - When `antialias` is `true`, `4` samples are used by default. Set this parameter to any other integer value than 0 to overwrite the default.
+	 * @property {boolean} [forceWebGL=false] - If set to `true`, the renderer uses a WebGL 2 backend no matter if WebGPU is supported or not.
+	 * @property {boolean} [trackTimestamp=false] - Whether to track timestamps with a Timestamp Query API or not.
+	 * @property {string} [powerPreference=undefined] - The power preference.
+	 * @property {Object} [requiredLimits=undefined] - Specifies the limits that are required by the device request. The request will fail if the adapter cannot provide these limits.
+	 * @property {GPUDevice} [device=undefined] - If there is an existing GPU device on app level, it can be passed to the renderer as a parameter.
+	 * @property {number} [outputType=undefined] - Texture type for output to canvas. By default, device's preferred format is used; other formats may incur overhead.
+	 */
+
 	/**
 	 * Constructs a new WebGPU backend.
 	 *
-	 * @param {Object} parameters - The configuration parameter.
-	 * @param {boolean} [parameters.logarithmicDepthBuffer=false] - Whether logarithmic depth buffer is enabled or not.
-	 * @param {boolean} [parameters.alpha=true] - Whether the default framebuffer (which represents the final contents of the canvas) should be transparent or opaque.
-	 * @param {boolean} [parameters.depth=true] - Whether the default framebuffer should have a depth buffer or not.
-	 * @param {boolean} [parameters.stencil=false] - Whether the default framebuffer should have a stencil buffer or not.
-	 * @param {boolean} [parameters.antialias=false] - Whether MSAA as the default anti-aliasing should be enabled or not.
-	 * @param {number} [parameters.samples=0] - When `antialias` is `true`, `4` samples are used by default. Set this parameter to any other integer value than 0 to overwrite the default.
-	 * @param {boolean} [parameters.forceWebGL=false] - If set to `true`, the renderer uses a WebGL 2 backend no matter if WebGPU is supported or not.
-	 * @param {boolean} [parameters.trackTimestamp=false] - Whether to track timestamps with a Timestamp Query API or not.
-	 * @param {string} [parameters.powerPreference=undefined] - The power preference.
-	 * @param {Object} [parameters.requiredLimits=undefined] - Specifies the limits that are required by the device request. The request will fail if the adapter cannot provide these limits.
-	 * @param {GPUDevice} [parameters.device=undefined] - If there is an existing GPU device on app level, it can be passed to the renderer as a parameter.
-	 * @param {number} [parameters.outputType=undefined] - Texture type for output to canvas. By default, device's preferred format is used; other formats may incur overhead.
+	 * @param {WebGPUBackend~Options} [parameters] - The configuration parameter.
 	 */
 	constructor( parameters = {} ) {
 
@@ -60,14 +66,6 @@ class WebGPUBackend extends Backend {
 
 		this.parameters.requiredLimits = ( parameters.requiredLimits === undefined ) ? {} : parameters.requiredLimits;
 
-		/**
-		 * Whether to track timestamps with a Timestamp Query API or not.
-		 *
-		 * @type {boolean}
-		 * @default false
-		 */
-		this.trackTimestamp = ( parameters.trackTimestamp === true );
-
 		/**
 		 * A reference to the device.
 		 *
@@ -363,10 +361,9 @@ class WebGPUBackend extends Backend {
 			renderTargetData.width !== renderTarget.width ||
 			renderTargetData.height !== renderTarget.height ||
 			renderTargetData.dimensions !== renderTarget.dimensions ||
-			renderTargetData.activeMipmapLevel !== renderTarget.activeMipmapLevel ||
+			renderTargetData.activeMipmapLevel !== renderContext.activeMipmapLevel ||
 			renderTargetData.activeCubeFace !== renderContext.activeCubeFace ||
-			renderTargetData.samples !== renderTarget.samples ||
-			renderTargetData.loadOp !== colorAttachmentsConfig.loadOp
+			renderTargetData.samples !== renderTarget.samples
 		) {
 
 			descriptors = {};
@@ -378,23 +375,25 @@ class WebGPUBackend extends Backend {
 			const onDispose = () => {
 
 				renderTarget.removeEventListener( 'dispose', onDispose );
-
 				this.delete( renderTarget );
 
 			};
 
-			renderTarget.addEventListener( 'dispose', onDispose );
+			if ( renderTarget.hasEventListener( 'dispose', onDispose ) === false ) {
+
+				renderTarget.addEventListener( 'dispose', onDispose );
+
+			}
 
 		}
 
 		const cacheKey = renderContext.getCacheKey();
+		let descriptorBase = descriptors[ cacheKey ];
 
-		let descriptor = descriptors[ cacheKey ];
-
-		if ( descriptor === undefined ) {
+		if ( descriptorBase === undefined ) {
 
 			const textures = renderContext.textures;
-			const colorAttachments = [];
+			const textureViews = [];
 
 			let sliceIndex;
 
@@ -442,44 +441,24 @@ class WebGPUBackend extends Backend {
 
 				}
 
-				// only apply the user-defined clearValue to the first color attachment like in beginRender()
-
-				let clearValue = { r: 0, g: 0, b: 0, a: 1 };
-
-				if ( i === 0 && colorAttachmentsConfig.clearValue ) {
-
-					clearValue = colorAttachmentsConfig.clearValue;
-
-				}
-
-				colorAttachments.push( {
+				textureViews.push( {
 					view,
-					depthSlice: sliceIndex,
 					resolveTarget,
-					loadOp: colorAttachmentsConfig.loadOP || GPULoadOp.Load,
-					storeOp: colorAttachmentsConfig.storeOP || GPUStoreOp.Store,
-					clearValue: clearValue
+					depthSlice: sliceIndex
 				} );
 
 			}
 
-
-			descriptor = {
-				colorAttachments,
-			};
+			descriptorBase = { textureViews };
 
 			if ( renderContext.depth ) {
 
 				const depthTextureData = this.get( renderContext.depthTexture );
-
-				const depthStencilAttachment = {
-					view: depthTextureData.texture.createView()
-				};
-				descriptor.depthStencilAttachment = depthStencilAttachment;
+				descriptorBase.depthStencilView = depthTextureData.texture.createView();
 
 			}
 
-			descriptors[ cacheKey ] = descriptor;
+			descriptors[ cacheKey ] = descriptorBase;
 
 			renderTargetData.width = renderTarget.width;
 			renderTargetData.height = renderTarget.height;
@@ -487,8 +466,41 @@ class WebGPUBackend extends Backend {
 			renderTargetData.activeMipmapLevel = renderContext.activeMipmapLevel;
 			renderTargetData.activeCubeFace = renderContext.activeCubeFace;
 			renderTargetData.dimensions = renderTarget.dimensions;
-			renderTargetData.depthSlice = sliceIndex;
-			renderTargetData.loadOp = colorAttachments[ 0 ].loadOp;
+
+		}
+
+		const descriptor = {
+			colorAttachments: []
+		};
+
+		// Apply dynamic properties to cached views
+		for ( let i = 0; i < descriptorBase.textureViews.length; i ++ ) {
+
+			const viewInfo = descriptorBase.textureViews[ i ];
+
+			let clearValue = { r: 0, g: 0, b: 0, a: 1 };
+			if ( i === 0 && colorAttachmentsConfig.clearValue ) {
+
+				clearValue = colorAttachmentsConfig.clearValue;
+
+			}
+
+			descriptor.colorAttachments.push( {
+				view: viewInfo.view,
+				depthSlice: viewInfo.depthSlice,
+				resolveTarget: viewInfo.resolveTarget,
+				loadOp: colorAttachmentsConfig.loadOp || GPULoadOp.Load,
+				storeOp: colorAttachmentsConfig.storeOp || GPUStoreOp.Store,
+				clearValue: clearValue
+			} );
+
+		}
+
+		if ( descriptorBase.depthStencilView ) {
+
+			descriptor.depthStencilAttachment = {
+				view: descriptorBase.depthStencilView
+			};
 
 		}
 
@@ -867,7 +879,6 @@ class WebGPUBackend extends Backend {
 		const renderer = this.renderer;
 
 		let colorAttachments = [];
-
 		let depthStencilAttachment;
 		let clearValue;
 
@@ -911,29 +922,35 @@ class WebGPUBackend extends Backend {
 			supportsDepth = renderTargetContext.depth;
 			supportsStencil = renderTargetContext.stencil;
 
-			if ( color ) {
+			const clearConfig = {
+				loadOp: color ? GPULoadOp.Clear : GPULoadOp.Load,
+				clearValue: color ? clearValue : undefined
+			};
 
-				const descriptor = this._getRenderPassDescriptor( renderTargetContext, { loadOp: GPULoadOp.Clear, clearValue } );
+			if ( supportsDepth ) {
 
-				colorAttachments = descriptor.colorAttachments;
+				clearConfig.depthLoadOp = depth ? GPULoadOp.Clear : GPULoadOp.Load;
+				clearConfig.depthClearValue = depth ? renderer.getClearDepth() : undefined;
+				clearConfig.depthStoreOp = GPUStoreOp.Store;
 
 			}
 
-			if ( supportsDepth || supportsStencil ) {
-
-				const depthTextureData = this.get( renderTargetContext.depthTexture );
+			if ( supportsStencil ) {
 
-				depthStencilAttachment = {
-					view: depthTextureData.texture.createView()
-				};
+				clearConfig.stencilLoadOp = stencil ? GPULoadOp.Clear : GPULoadOp.Load;
+				clearConfig.stencilClearValue = stencil ? renderer.getClearStencil() : undefined;
+				clearConfig.stencilStoreOp = GPUStoreOp.Store;
 
 			}
 
-		}
+			const descriptor = this._getRenderPassDescriptor( renderTargetContext, clearConfig );
 
-		//
+			colorAttachments = descriptor.colorAttachments;
+			depthStencilAttachment = descriptor.depthStencilAttachment;
+
+		}
 
-		if ( supportsDepth ) {
+		if ( supportsDepth && depthStencilAttachment && depthStencilAttachment.depthLoadOp === undefined ) {
 
 			if ( depth ) {
 
@@ -952,7 +969,7 @@ class WebGPUBackend extends Backend {
 
 		//
 
-		if ( supportsStencil ) {
+		if ( supportsStencil && depthStencilAttachment && depthStencilAttachment.stencilLoadOp === undefined ) {
 
 			if ( stencil ) {
 
@@ -1865,38 +1882,56 @@ class WebGPUBackend extends Backend {
 	 *
 	 * @param {Texture} srcTexture - The source texture.
 	 * @param {Texture} dstTexture - The destination texture.
-	 * @param {?Vector4} [srcRegion=null] - The region of the source texture to copy.
+	 * @param {?(Box3|Box2)} [srcRegion=null] - The region of the source texture to copy.
 	 * @param {?(Vector2|Vector3)} [dstPosition=null] - The destination position of the copy.
-	 * @param {number} [level=0] - The mip level to copy.
+	 * @param {number} [srcLevel=0] - The mipmap level to copy.
+	 * @param {number} [dstLevel=0] - The destination mip level to copy to.
 	 */
-	copyTextureToTexture( srcTexture, dstTexture, srcRegion = null, dstPosition = null, level = 0 ) {
+	copyTextureToTexture( srcTexture, dstTexture, srcRegion = null, dstPosition = null, srcLevel = 0, dstLevel = 0 ) {
 
 		let dstX = 0;
 		let dstY = 0;
-		let dstLayer = 0;
+		let dstZ = 0;
 
 		let srcX = 0;
 		let srcY = 0;
-		let srcLayer = 0;
+		let srcZ = 0;
 
 		let srcWidth = srcTexture.image.width;
 		let srcHeight = srcTexture.image.height;
+		let srcDepth = 1;
+
 
 		if ( srcRegion !== null ) {
 
-			srcX = srcRegion.x;
-			srcY = srcRegion.y;
-			srcLayer = srcRegion.z || 0;
-			srcWidth = srcRegion.width;
-			srcHeight = srcRegion.height;
+			if ( srcRegion.isBox3 === true ) {
+
+				srcX = srcRegion.min.x;
+				srcY = srcRegion.min.y;
+				srcZ = srcRegion.min.z;
+				srcWidth = srcRegion.max.x - srcRegion.min.x;
+				srcHeight = srcRegion.max.y - srcRegion.min.y;
+				srcDepth = srcRegion.max.z - srcRegion.min.z;
+
+			} else {
+
+				// Assume it's a Box2
+				srcX = srcRegion.min.x;
+				srcY = srcRegion.min.y;
+				srcWidth = srcRegion.max.x - srcRegion.min.x;
+				srcHeight = srcRegion.max.y - srcRegion.min.y;
+				srcDepth = 1;
+
+			}
 
 		}
 
+
 		if ( dstPosition !== null ) {
 
 			dstX = dstPosition.x;
 			dstY = dstPosition.y;
-			dstLayer = dstPosition.z || 0;
+			dstZ = dstPosition.z || 0;
 
 		}
 
@@ -1908,23 +1943,29 @@ class WebGPUBackend extends Backend {
 		encoder.copyTextureToTexture(
 			{
 				texture: sourceGPU,
-				mipLevel: level,
-				origin: { x: srcX, y: srcY, z: srcLayer }
+				mipLevel: srcLevel,
+				origin: { x: srcX, y: srcY, z: srcZ }
 			},
 			{
 				texture: destinationGPU,
-				mipLevel: level,
-				origin: { x: dstX, y: dstY, z: dstLayer }
+				mipLevel: dstLevel,
+				origin: { x: dstX, y: dstY, z: dstZ }
 			},
 			[
 				srcWidth,
 				srcHeight,
-				1
+				srcDepth
 			]
 		);
 
 		this.device.queue.submit( [ encoder.finish() ] );
 
+		if ( dstLevel === 0 && dstTexture.generateMipmaps ) {
+
+			this.textureUtils.generateMipmaps( dstTexture );
+
+		}
+
 	}
 
 	/**

package/src/renderers/webgpu/WebGPURenderer.Nodes.js

@@ -15,17 +15,7 @@ class WebGPURenderer extends Renderer {
 	/**
 	 * Constructs a new WebGPU renderer.
 	 *
-	 * @param {Object} parameters - The configuration parameter.
-	 * @param {boolean} [parameters.logarithmicDepthBuffer=false] - Whether logarithmic depth buffer is enabled or not.
-	 * @param {boolean} [parameters.alpha=true] - Whether the default framebuffer (which represents the final contents of the canvas) should be transparent or opaque.
-	 * @param {boolean} [parameters.depth=true] - Whether the default framebuffer should have a depth buffer or not.
-	 * @param {boolean} [parameters.stencil=false] - Whether the default framebuffer should have a stencil buffer or not.
-	 * @param {boolean} [parameters.antialias=false] - Whether MSAA as the default anti-aliasing should be enabled or not.
-	 * @param {number} [parameters.samples=0] - When `antialias` is `true`, `4` samples are used by default. Set this parameter to any other integer value than 0 to overwrite the default.
-	 * @param {boolean} [parameters.forceWebGL=false] - If set to `true`, the renderer uses it WebGL 2 backend no matter if WebGPU is supported or not.
-	 * @param {number} [parameters.outputType=undefined] - Texture type for output to canvas. By default, device's preferred format is used; other formats may incur overhead.
-	 * @param {number} [parameters.colorBufferType=HalfFloatType] - Defines the type of color buffers. The default `HalfFloatType` is recommend for best
-	 * quality. To save memory and bandwidth, `UnsignedByteType` might be used. This will reduce rendering quality though.
+	 * @param {WebGPURenderer~Options} [parameters] - The configuration parameter.
 	 */
 	constructor( parameters = {} ) {
 

package/src/renderers/webgpu/WebGPURenderer.js

@@ -27,20 +27,26 @@ const debugHandler = {
 class WebGPURenderer extends Renderer {
 
 	/**
-	 * Constructs a new WebGPU renderer.
+	 * WebGPURenderer options.
 	 *
-	 * @param {Object} parameters - The configuration parameter.
-	 * @param {boolean} [parameters.logarithmicDepthBuffer=false] - Whether logarithmic depth buffer is enabled or not.
-	 * @param {boolean} [parameters.alpha=true] - Whether the default framebuffer (which represents the final contents of the canvas) should be transparent or opaque.
-	 * @param {boolean} [parameters.depth=true] - Whether the default framebuffer should have a depth buffer or not.
-	 * @param {boolean} [parameters.stencil=false] - Whether the default framebuffer should have a stencil buffer or not.
-	 * @param {boolean} [parameters.antialias=false] - Whether MSAA as the default anti-aliasing should be enabled or not.
-	 * @param {number} [parameters.samples=0] - When `antialias` is `true`, `4` samples are used by default. Set this parameter to any other integer value than 0 to overwrite the default.
-	 * @param {boolean} [parameters.forceWebGL=false] - If set to `true`, the renderer uses a WebGL 2 backend no matter if WebGPU is supported or not.
-	 * @param {number} [parameters.outputType=undefined] - Texture type for output to canvas. By default, device's preferred format is used; other formats may incur overhead.
-	 * @param {number} [parameters.colorBufferType=HalfFloatType] - Defines the type of color buffers. The default `HalfFloatType` is recommend for best
+	 * @typedef {Object} WebGPURenderer~Options
+	 * @property {boolean} [logarithmicDepthBuffer=false] - Whether logarithmic depth buffer is enabled or not.
+	 * @property {boolean} [alpha=true] - Whether the default framebuffer (which represents the final contents of the canvas) should be transparent or opaque.
+	 * @property {boolean} [depth=true] - Whether the default framebuffer should have a depth buffer or not.
+	 * @property {boolean} [stencil=false] - Whether the default framebuffer should have a stencil buffer or not.
+	 * @property {boolean} [antialias=false] - Whether MSAA as the default anti-aliasing should be enabled or not.
+	 * @property {number} [samples=0] - When `antialias` is `true`, `4` samples are used by default. Set this parameter to any other integer value than 0 to overwrite the default.
+	 * @property {boolean} [forceWebGL=false] - If set to `true`, the renderer uses a WebGL 2 backend no matter if WebGPU is supported or not.
+	 * @property {number} [outputType=undefined] - Texture type for output to canvas. By default, device's preferred format is used; other formats may incur overhead.
+	 * @property {number} [colorBufferType=HalfFloatType] - Defines the type of color buffers. The default `HalfFloatType` is recommend for best
 	 * quality. To save memory and bandwidth, `UnsignedByteType` might be used. This will reduce rendering quality though.
 	 */
+
+	/**
+	 * Constructs a new WebGPU renderer.
+	 *
+	 * @param {WebGPURenderer~Options} [parameters] - The configuration parameter.
+	 */
 	constructor( parameters = {} ) {
 
 		let BackendClass;