super-three 0.181.0 → 0.184.0

package/src/renderers/common/Pipelines.js

@@ -1,5 +1,5 @@
 import DataMap from './DataMap.js';
-import RenderPipeline from './RenderPipeline.js';
+import RenderObjectPipeline from './RenderObjectPipeline.js';
 import ComputePipeline from './ComputePipeline.js';
 import ProgrammableStage from './ProgrammableStage.js';
 
@@ -15,9 +15,10 @@ class Pipelines extends DataMap {
 	 * Constructs a new pipeline management component.
 	 *
 	 * @param {Backend} backend - The renderer's backend.
-	 * @param {Nodes} nodes - Renderer component for managing nodes related logic.
+	 * @param {NodeManager} nodes - Renderer component for managing nodes related logic.
+	 * @param {Info} info - Renderer component for managing metrics and monitoring data.
 	 */
-	constructor( backend, nodes ) {
+	constructor( backend, nodes, info ) {
 
 		super();
 
@@ -31,10 +32,17 @@ class Pipelines extends DataMap {
 		/**
 		 * Renderer component for managing nodes related logic.
 		 *
-		 * @type {Nodes}
+		 * @type {NodeManager}
 		 */
 		this.nodes = nodes;
 
+		/**
+		 * Renderer component for managing metrics and monitoring data.
+		 *
+		 * @type {Info}
+		 */
+		this.info = info;
+
 		/**
 		 * A references to the bindings management component.
 		 * This reference will be set inside the `Bindings`
@@ -108,6 +116,7 @@ class Pipelines extends DataMap {
 				this.programs.compute.set( nodeBuilderState.computeShader, stageCompute );
 
 				backend.createProgram( stageCompute );
+				this.info.createProgram( stageCompute );
 
 			}
 
@@ -146,7 +155,7 @@ class Pipelines extends DataMap {
 	 *
 	 * @param {RenderObject} renderObject - The render object.
 	 * @param {?Array<Promise>} [promises=null] - An array of compilation promises which is only relevant in context of `Renderer.compileAsync()`.
-	 * @return {RenderPipeline} The render pipeline.
+	 * @return {RenderObjectPipeline} The render pipeline.
 	 */
 	getForRender( renderObject, promises = null ) {
 
@@ -184,6 +193,7 @@ class Pipelines extends DataMap {
 				this.programs.vertex.set( nodeBuilderState.vertexShader, stageVertex );
 
 				backend.createProgram( stageVertex );
+				this.info.createProgram( stageVertex );
 
 			}
 
@@ -197,6 +207,7 @@ class Pipelines extends DataMap {
 				this.programs.fragment.set( nodeBuilderState.fragmentShader, stageFragment );
 
 				backend.createProgram( stageFragment );
+				this.info.createProgram( stageFragment );
 
 			}
 
@@ -234,6 +245,26 @@ class Pipelines extends DataMap {
 
 	}
 
+	/**
+	 * Checks if the render pipeline for the given render object is ready for drawing.
+	 * Returns false if the GPU pipeline is still being compiled asynchronously.
+	 *
+	 * @param {RenderObject} renderObject - The render object.
+	 * @return {boolean} True if the pipeline is ready for drawing.
+	 */
+	isReady( renderObject ) {
+
+		const data = this.get( renderObject );
+		const pipeline = data.pipeline;
+
+		if ( pipeline === undefined ) return false;
+
+		const pipelineData = this.backend.get( pipeline );
+
+		return pipelineData.pipeline !== undefined && pipelineData.pipeline !== null;
+
+	}
+
 	/**
 	 * Deletes the pipeline for the given render object.
 	 *
@@ -344,7 +375,7 @@ class Pipelines extends DataMap {
 	 * @param {ProgrammableStage} stageFragment - The programmable stage representing the fragment shader.
 	 * @param {string} cacheKey - The cache key.
 	 * @param {?Array<Promise>} promises - An array of compilation promises which is only relevant in context of `Renderer.compileAsync()`.
-	 * @return {ComputePipeline} The compute pipeline.
+	 * @return {RenderObjectPipeline} The render pipeline.
 	 */
 	_getRenderPipeline( renderObject, stageVertex, stageFragment, cacheKey, promises ) {
 
@@ -356,7 +387,7 @@ class Pipelines extends DataMap {
 
 		if ( pipeline === undefined ) {
 
-			pipeline = new RenderPipeline( cacheKey, stageVertex, stageFragment );
+			pipeline = new RenderObjectPipeline( cacheKey, stageVertex, stageFragment );
 
 			this.caches.set( cacheKey, pipeline );
 
@@ -428,6 +459,8 @@ class Pipelines extends DataMap {
 
 		this.programs[ stage ].delete( code );
 
+		this.info.destroyProgram( program );
+
 	}
 
 	/**

package/src/renderers/common/PostProcessing.js

@@ -1,223 +1,25 @@
-import NodeMaterial from '../../materials/nodes/NodeMaterial.js';
-import { ColorManagement } from '../../math/ColorManagement.js';
-import { vec4, renderOutput } from '../../nodes/TSL.js';
-import { NoToneMapping } from '../../constants.js';
-import QuadMesh from '../../renderers/common/QuadMesh.js';
+import RenderPipeline from './RenderPipeline.js';
 import { warnOnce } from '../../utils.js';
 
 /**
- * This module is responsible to manage the post processing setups in apps.
- * You usually create a single instance of this class and use it to define
- * the output of your post processing effect chain.
- * ```js
- * const postProcessing = new PostProcessing( renderer );
+ * @deprecated since r183. Use {@link RenderPipeline} instead. PostProcessing has been renamed to RenderPipeline.
  *
- * const scenePass = pass( scene, camera );
- *
- * postProcessing.outputNode = scenePass;
- * ```
- *
- * Note: This module can only be used with `WebGPURenderer`.
+ * This class is a wrapper for backward compatibility and will be removed in a future version.
  */
-class PostProcessing {
+class PostProcessing extends RenderPipeline {
 
 	/**
 	 * Constructs a new post processing management module.
 	 *
 	 * @param {Renderer} renderer - A reference to the renderer.
 	 * @param {Node<vec4>} outputNode - An optional output node.
+	 * @deprecated since r183. Use {@link RenderPipeline} instead.
 	 */
-	constructor( renderer, outputNode = vec4( 0, 0, 1, 1 ) ) {
-
-		/**
-		 * A reference to the renderer.
-		 *
-		 * @type {Renderer}
-		 */
-		this.renderer = renderer;
-
-		/**
-		 * A node which defines the final output of the post
-		 * processing. This is usually the last node in a chain
-		 * of effect nodes.
-		 *
-		 * @type {Node<vec4>}
-		 */
-		this.outputNode = outputNode;
-
-		/**
-		 * Whether the default output tone mapping and color
-		 * space transformation should be enabled or not.
-		 *
-		 * It is enabled by default by it must be disabled when
-		 * effects must be executed after tone mapping and color
-		 * space conversion. A typical example is FXAA which
-		 * requires sRGB input.
-		 *
-		 * When set to `false`, the app must control the output
-		 * transformation with `RenderOutputNode`.
-		 *
-		 * ```js
-		 * const outputPass = renderOutput( scenePass );
-		 * ```
-		 *
-		 * @type {boolean}
-		 */
-		this.outputColorTransform = true;
-
-		/**
-		 * Must be set to `true` when the output node changes.
-		 *
-		 * @type {Node<vec4>}
-		 */
-		this.needsUpdate = true;
-
-		const material = new NodeMaterial();
-		material.name = 'PostProcessing';
-
-		/**
-		 * The full screen quad that is used to render
-		 * the effects.
-		 *
-		 * @private
-		 * @type {QuadMesh}
-		 */
-		this._quadMesh = new QuadMesh( material );
-		this._quadMesh.name = 'Post-Processing';
-
-		/**
-		 * The context of the post processing stack.
-		 *
-		 * @private
-		 * @type {?Object}
-		 * @default null
-		 */
-		this._context = null;
-
-	}
-
-	/**
-	 * When `PostProcessing` is used to apply post processing effects,
-	 * the application must use this version of `render()` inside
-	 * its animation loop (not the one from the renderer).
-	 */
-	render() {
-
-		const renderer = this.renderer;
-
-		this._update();
-
-		if ( this._context.onBeforePostProcessing !== null ) this._context.onBeforePostProcessing();
-
-		const toneMapping = renderer.toneMapping;
-		const outputColorSpace = renderer.outputColorSpace;
-
-		renderer.toneMapping = NoToneMapping;
-		renderer.outputColorSpace = ColorManagement.workingColorSpace;
-
-		//
-
-		const currentXR = renderer.xr.enabled;
-		renderer.xr.enabled = false;
-
-		this._quadMesh.render( renderer );
-
-		renderer.xr.enabled = currentXR;
-
-		//
-
-		renderer.toneMapping = toneMapping;
-		renderer.outputColorSpace = outputColorSpace;
-
-		if ( this._context.onAfterPostProcessing !== null ) this._context.onAfterPostProcessing();
-
-	}
-
-	/**
-	 * Returns the current context of the post processing stack.
-	 *
-	 * @readonly
-	 * @type {?Object}
-	 */
-	get context() {
-
-		return this._context;
-
-	}
-
-	/**
-	 * Frees internal resources.
-	 */
-	dispose() {
-
-		this._quadMesh.material.dispose();
-
-	}
-
-	/**
-	 * Updates the state of the module.
-	 *
-	 * @private
-	 */
-	_update() {
-
-		if ( this.needsUpdate === true ) {
-
-			const renderer = this.renderer;
-
-			const toneMapping = renderer.toneMapping;
-			const outputColorSpace = renderer.outputColorSpace;
-
-			const context = {
-				postProcessing: this,
-				onBeforePostProcessing: null,
-				onAfterPostProcessing: null
-			};
-
-			let outputNode = this.outputNode;
-
-			if ( this.outputColorTransform === true ) {
-
-				outputNode = outputNode.context( context );
-
-				outputNode = renderOutput( outputNode, toneMapping, outputColorSpace );
-
-			} else {
-
-				context.toneMapping = toneMapping;
-				context.outputColorSpace = outputColorSpace;
-
-				outputNode = outputNode.context( context );
-
-			}
-
-			this._context = context;
-
-			this._quadMesh.material.fragmentNode = outputNode;
-			this._quadMesh.material.needsUpdate = true;
-
-			this.needsUpdate = false;
-
-		}
-
-	}
-
-	/**
-	 * When `PostProcessing` is used to apply post processing effects,
-	 * the application must use this version of `renderAsync()` inside
-	 * its animation loop (not the one from the renderer).
-	 *
-	 * @async
-	 * @deprecated
-	 * @return {Promise} A Promise that resolves when the render has been finished.
-	 */
-	async renderAsync() {
-
-		warnOnce( 'PostProcessing: "renderAsync()" has been deprecated. Use "render()" and "await renderer.init();" when creating the renderer.' ); // @deprecated r181
+	constructor( renderer, outputNode ) {
 
-		await this.renderer.init();
+		warnOnce( 'PostProcessing: "PostProcessing" has been renamed to "RenderPipeline". Please update your code to use "THREE.RenderPipeline" instead.' ); // @deprecated, r183
 
-		this.render();
+		super( renderer, outputNode );
 
 	}
 

package/src/renderers/common/ReadbackBuffer.js

@@ -0,0 +1,78 @@
+import { EventDispatcher } from '../../core/EventDispatcher.js';
+
+/**
+ * A readback buffer is used to transfer data from the GPU to the CPU.
+ * It is primarily used to read back compute shader results.
+ *
+ * @augments EventDispatcher
+ */
+class ReadbackBuffer extends EventDispatcher {
+
+	/**
+	 * Constructs a new readback buffer.
+	 *
+	 * @param {number} maxByteLength - The maximum size of the buffer to be read back.
+	 */
+	constructor( maxByteLength ) {
+
+		super();
+
+		/**
+		 * Name used for debugging purposes.
+		 *
+		 * @type {string}
+		 */
+		this.name = '';
+
+		/**
+		 * The mapped, read back array buffer.
+		 *
+		 * @type {ArrayBuffer|null}
+		 */
+		this.buffer = null;
+
+		/**
+		 * The maximum size of the buffer to be read back.
+		 *
+		 * @type {number}
+		 */
+		this.maxByteLength = maxByteLength;
+
+		/**
+		 * This flag can be used for type testing.
+		 *
+		 * @type {boolean}
+		 * @readonly
+		 * @default true
+		 */
+		this.isReadbackBuffer = true;
+
+		this._mapped = false;
+
+	}
+
+	/**
+	 * Releases the mapped buffer data so the GPU buffer can be
+	 * used by the GPU again.
+	 *
+	 * Note: Any `ArrayBuffer` data associated with this readback buffer
+	 * are removed and no longer accessible after calling this method.
+	 */
+	release() {
+
+		this.dispatchEvent( { type: 'release' } );
+
+	}
+
+	/**
+	 * Frees internal resources.
+	 */
+	dispose() {
+
+		this.dispatchEvent( { type: 'dispose' } );
+
+	}
+
+}
+
+export default ReadbackBuffer;

package/src/renderers/common/RenderBundle.js

@@ -11,11 +11,13 @@ class RenderBundle {
 	 *
 	 * @param {BundleGroup} bundleGroup - The bundle group.
 	 * @param {Camera} camera - The camera the bundle group is rendered with.
+	 * @param {RenderContext} renderContext - The render context the bundle is rendered with.
 	 */
-	constructor( bundleGroup, camera ) {
+	constructor( bundleGroup, camera, renderContext ) {
 
 		this.bundleGroup = bundleGroup;
 		this.camera = camera;
+		this.renderContext = renderContext;
 
 	}
 

package/src/renderers/common/RenderBundles.js

@@ -29,25 +29,29 @@ class RenderBundles {
 	 *
 	 * @param {BundleGroup} bundleGroup - The bundle group.
 	 * @param {Camera} camera - The camera the bundle group is rendered with.
+	 * @param {RenderContext} renderContext - The render context the bundle is rendered with.
 	 * @return {RenderBundle} The render bundle.
 	 */
-	get( bundleGroup, camera ) {
+	get( bundleGroup, camera, renderContext ) {
 
 		const bundles = this.bundles;
 
 		_chainKeys[ 0 ] = bundleGroup;
 		_chainKeys[ 1 ] = camera;
+		_chainKeys[ 2 ] = renderContext;
 
 		let bundle = bundles.get( _chainKeys );
 
 		if ( bundle === undefined ) {
 
-			bundle = new RenderBundle( bundleGroup, camera );
+			bundle = new RenderBundle( bundleGroup, camera, renderContext );
 			bundles.set( _chainKeys, bundle );
 
 		}
 
-		_chainKeys.length = 0;
+		_chainKeys[ 0 ] = null;
+		_chainKeys[ 1 ] = null;
+		_chainKeys[ 2 ] = null;
 
 		return bundle;
 

package/src/renderers/common/RenderContext.js

@@ -25,6 +25,14 @@ class RenderContext {
 		 */
 		this.id = _id ++;
 
+		/**
+		 * The MRT configuration.
+		 *
+		 * @type {?MRTNode}
+		 * @default null
+		 */
+		this.mrt = null;
+
 		/**
 		 * Whether the current active framebuffer has a color attachment.
 		 *
@@ -214,6 +222,14 @@ class RenderContext {
 		 */
 		this.clippingContext = null;
 
+		/**
+		 * The current camera.
+		 *
+		 * @type {?Camera}
+		 * @default null
+		 */
+		this.camera = null;
+
 		/**
 		 * This flag can be used for type testing.
 		 *

package/src/renderers/common/RenderContexts.js

@@ -1,11 +1,4 @@
-import ChainMap from './ChainMap.js';
 import RenderContext from './RenderContext.js';
-import { Scene } from '../../scenes/Scene.js';
-import { Camera } from '../../cameras/Camera.js';
-
-const _chainKeys = [];
-const _defaultScene = /*@__PURE__*/ new Scene();
-const _defaultCamera = /*@__PURE__*/ new Camera();
 
 /**
  * This module manages the render contexts of the renderer.
@@ -16,31 +9,38 @@ class RenderContexts {
 
 	/**
 	 * Constructs a new render context management component.
+	 *
+	 * @param {Renderer} renderer - The renderer.
 	 */
-	constructor() {
+	constructor( renderer ) {
 
 		/**
-		 * A dictionary that manages render contexts in chain maps
-		 * for each attachment state.
+		 * The renderer.
 		 *
-		 * @type {Object<string,ChainMap>}
+		 * @type {Renderer}
 		 */
-		this.chainMaps = {};
+		this.renderer = renderer;
+
+		/**
+		 * A dictionary that manages render contexts.
+		 *
+		 * @type {Object<string,RenderContext>}
+		 */
+		this._renderContexts = {};
 
 	}
 
 	/**
 	 * Returns a render context for the given scene, camera and render target.
 	 *
-	 * @param {Scene} scene - The scene.
-	 * @param {Camera} camera - The camera that is used to render the scene.
 	 * @param {?RenderTarget} [renderTarget=null] - The active render target.
+	 * @param {?MRTNode} [mrt=null] - The MRT configuration
+	 * @param {?number} [callDepth=0] - The call depth of the renderer.
 	 * @return {RenderContext} The render context.
 	 */
-	get( scene, camera, renderTarget = null ) {
+	get( renderTarget = null, mrt = null, callDepth = 0 ) {
 
-		_chainKeys[ 0 ] = scene;
-		_chainKeys[ 1 ] = camera;
+		//
 
 		let attachmentState;
 
@@ -51,54 +51,38 @@ class RenderContexts {
 		} else {
 
 			const format = renderTarget.texture.format;
+			const type = renderTarget.texture.type;
 			const count = renderTarget.textures.length;
 
-			attachmentState = `${ count }:${ format }:${ renderTarget.samples }:${ renderTarget.depthBuffer }:${ renderTarget.stencilBuffer }`;
+			attachmentState = `${ count }:${ format }:${ type }:${ renderTarget.samples }:${ renderTarget.depthBuffer }:${ renderTarget.stencilBuffer }`;
 
 		}
 
-		const chainMap = this._getChainMap( attachmentState );
+		//
+
+		const mrtState = ( mrt !== null ) ? mrt.id : 'default';
 
-		let renderState = chainMap.get( _chainKeys );
+		//
+
+		const renderStateKey = attachmentState + '-' + mrtState + '-' + callDepth;
+
+		let renderState = this._renderContexts[ renderStateKey ];
 
 		if ( renderState === undefined ) {
 
 			renderState = new RenderContext();
+			renderState.mrt = mrt;
 
-			chainMap.set( _chainKeys, renderState );
+			this._renderContexts[ renderStateKey ] = renderState;
 
 		}
 
-		_chainKeys.length = 0;
-
 		if ( renderTarget !== null ) renderState.sampleCount = renderTarget.samples === 0 ? 1 : renderTarget.samples;
 
-		return renderState;
+		renderState.clearDepthValue = this.renderer.getClearDepth();
+		renderState.clearStencilValue = this.renderer.getClearStencil();
 
-	}
-
-	/**
-	 * Returns a render context intended for clear operations.
-	 *
-	 * @param {?RenderTarget} [renderTarget=null] - The active render target.
-	 * @return {RenderContext} The render context.
-	 */
-	getForClear( renderTarget = null ) {
-
-		return this.get( _defaultScene, _defaultCamera, renderTarget );
-
-	}
-
-	/**
-	 * Returns a chain map for the given attachment state.
-	 *
-	 * @private
-	 * @param {string} attachmentState - The attachment state.
-	 * @return {ChainMap} The chain map.
-	 */
-	_getChainMap( attachmentState ) {
-
-		return this.chainMaps[ attachmentState ] || ( this.chainMaps[ attachmentState ] = new ChainMap() );
+		return renderState;
 
 	}
 
@@ -107,7 +91,7 @@ class RenderContexts {
 	 */
 	dispose() {
 
-		this.chainMaps = {};
+		this._renderContexts = {};
 
 	}
 

package/src/renderers/common/RenderLists.js

@@ -57,7 +57,8 @@ class RenderLists {
 
 		}
 
-		_chainKeys.length = 0;
+		_chainKeys[ 0 ] = null;
+		_chainKeys[ 1 ] = null;
 
 		return list;