[pull] dev from mrdoob:dev

editor/js/Viewport.Controls.js

@@ -26,7 +26,7 @@ function ViewportControls( editor ) {
 
 		if ( object.isCamera ) {
 
-			update();
+			update( false );
 
 		}
 
@@ -59,7 +59,7 @@ function ViewportControls( editor ) {
 
 	//
 
-	function update() {
+	function update( effect = true ) {
 
 		const options = {};
 
@@ -79,7 +79,7 @@ function ViewportControls( editor ) {
 			: editor.camera;
 
 		cameraSelect.setValue( selectedCamera.uuid );
-		editor.setViewportCamera( selectedCamera.uuid );
+		if ( effect ) editor.setViewportCamera( selectedCamera.uuid );
 
 	}
 

manual/en/webgpu-postprocessing.html

@@ -45,7 +45,7 @@ <h2>Overview</h2>
             </p>
             <ul>
               <li>
-                `WebGPURenderer` and `PostProcessing` come with full, built-in MRT support.
+                `WebGPURenderer` comes with full, built-in MRT support.
               </li>
               <li>
                 The system combines effects if possible which reduces the overall number of render passes.
@@ -55,27 +55,27 @@ <h2>Overview</h2>
               </li>
             </ul>
             <p>
-               Let's find out how to integrate `PostProcessing` in three.js applications.
+               Let's find out how to integrate post-processing in three.js applications.
             </p>
 
             <h2>Basics</h2>
 
             <p>
               First, please read the instructions in the guide about <a href="webgpurenderer">WebGPURenderer</a> to correctly configure your 
-              imports. After that, you can create an instance of the post-processing module like so.
+              imports. After that, you can create an instance of the render pipleine module like so:
             </p>
 
 <pre class="prettyprint showlinemods notranslate lang-js" translate="no">
-const postProcessing = new THREE.PostProcessing( renderer );
+const renderPipeline = new THREE.RenderPipeline( renderer );
 </pre>
 
             <p>
-              The instance of `PostProcessing` replaces the previous instance of `EffectComposer`. To make sure you actually
+              The instance of `RenderPipeline` replaces the previous instance of `EffectComposer`. To make sure you actually
               use the output of the module, you have to update your animation loop like so:
             </p>
 <pre class="prettyprint showlinemods notranslate lang-js" translate="no">
 -  renderer.render( scene, camera );
-+  postProcessing.render();
++  renderPipeline.render();
 </pre>
 
             <p>
@@ -109,10 +109,10 @@ <h2>Basics</h2>
 </pre>
 
             <p>
-            When you are done, you can simply assign the final node to the `PostProcessing` instance.
+            When you are done, you can simply assign the final node to the `RenderPipeline` instance.
             </p>
 <pre class="prettyprint showlinemods notranslate lang-js" translate="no">
-postProcessing.outputNode = rgbShiftPass;
+renderPipeline.outputNode = rgbShiftPass;
 </pre>
 
             <h2>Tone Mapping and Color Spaces</h2>
@@ -130,16 +130,16 @@ <h2>Tone Mapping and Color Spaces</h2>
 
 // in your init routine
 
-const postProcessing = new THREE.PostProcessing( renderer );
-postProcessing.outputColorTransform = false; // disable default output color transform
+const renderPipeline = new THREE.RenderPipeline( renderer );
+renderPipeline.outputColorTransform = false; // disable default output color transform
 
 const scenePass = pass( scene, camera );
 const outputPass = renderOutput( scenePass ); // apply tone mapping and color space conversion here
 
 // FXAA must be computed in sRGB color space
 
 const fxaaPass = fxaa( outputPass );
-postProcessing.outputNode = fxaaPass;
+renderPipeline.outputNode = fxaaPass;
 </pre>
 
           <p>
@@ -183,7 +183,7 @@ <h2>MRT</h2>
 const scenePassVelocity = scenePass.getTextureNode( 'velocity' );
 
 const traaPass = traa( scenePassColor, scenePassDepth, scenePassVelocity, camera );
-postProcessing.outputNode = traaPass;
+renderPipeline.outputNode = traaPass;
 </pre>
 
           <p>

src/renderers/common/Bindings.js

@@ -267,8 +267,17 @@ class Bindings extends DataMap {
 				const attribute = binding.attribute;
 				const attributeType = attribute.isIndirectStorageBufferAttribute ? AttributeType.INDIRECT : AttributeType.STORAGE;
 
+				const bindingData = backend.get( binding );
+
 				this.attributes.update( attribute, attributeType );
 
+				if ( bindingData.attribute !== attribute ) {
+
+					bindingData.attribute = attribute;
+
+					needsBindingsUpdate = true;
+
+				}
 
 			}
 

src/renderers/common/StorageBuffer.js

@@ -21,9 +21,10 @@ class StorageBuffer extends Buffer {
 		/**
 		 * This flag can be used for type testing.
 		 *
+		 * @private
 		 * @type {BufferAttribute}
 		 */
-		this.attribute = attribute;
+		this._attribute = attribute;
 
 		/**
 		 * This flag can be used for type testing.
@@ -36,6 +37,17 @@ class StorageBuffer extends Buffer {
 
 	}
 
+	/**
+	 * The storage buffer attribute.
+	 *
+	 * @type {BufferAttribute}
+	 */
+	get attribute() {
+
+		return this._attribute;
+
+	}
+
 }
 
 export default StorageBuffer;

src/renderers/common/nodes/NodeStorageBuffer.js

@@ -45,14 +45,25 @@ class NodeStorageBuffer extends StorageBuffer {
 
 	}
 
+	/**
+	 * The storage buffer attribute node.
+	 *
+	 * @type {StorageBufferAttribute}
+	 */
+	get attribute() {
+
+		return this.nodeUniform.value;
+
+	}
+
 	/**
 	 * The storage buffer.
 	 *
-	 * @type {BufferAttribute}
+	 * @type {Float32Array}
 	 */
 	get buffer() {
 
-		return this.nodeUniform.value;
+		return this.nodeUniform.value.array;
 
 	}
 

src/renderers/webgpu/utils/WebGPUBindingUtils.js

@@ -323,20 +323,9 @@ class WebGPUBindingUtils {
 
 			} else if ( binding.isStorageBuffer ) {
 
-				const bindingData = backend.get( binding );
-
-				if ( bindingData.buffer === undefined ) {
-
-					const attribute = binding.attribute;
-					//const usage = GPUBufferUsage.STORAGE | GPUBufferUsage.VERTEX | /*GPUBufferUsage.COPY_SRC |*/ GPUBufferUsage.COPY_DST;
-
-					//backend.attributeUtils.createAttribute( attribute, usage ); // @TODO: Move it to universal renderer
+				const buffer = backend.get( binding.attribute ).buffer;
 
-					bindingData.buffer = backend.get( attribute ).buffer;
-
-				}
-
-				entriesGPU.push( { binding: bindingPoint, resource: { buffer: bindingData.buffer } } );
+				entriesGPU.push( { binding: bindingPoint, resource: { buffer: buffer } } );
 
 			} else if ( binding.isSampledTexture ) {