Universal Renderer and WebGPUBackend

examples/jsm/nodes/Nodes.js

@@ -141,8 +141,7 @@ export { default as NodeObjectLoader } from './loaders/NodeObjectLoader.js';
 export { default as NodeMaterialLoader } from './loaders/NodeMaterialLoader.js';
 
 // parsers
-export { default as WGSLNodeParser } from './parsers/WGSLNodeParser.js';
-export { default as GLSLNodeParser } from './parsers/GLSLNodeParser.js';
+export { default as GLSLNodeParser } from './parsers/GLSLNodeParser.js'; // @TODO: Move to jsm/renderers/webgl.
 
 // materials
 export * from './materials/Materials.js';

examples/jsm/nodes/core/NodeBuilder.js

@@ -68,6 +68,9 @@ class NodeBuilder {
 		this.flowCode = { vertex: '', fragment: '', compute: [] };
 		this.uniforms = { vertex: [], fragment: [], compute: [], index: 0 };
 		this.codes = { vertex: [], fragment: [], compute: [] };
+		this.bindings = { vertex: [], fragment: [], compute: [] };
+		this.bindingsOffset = { vertex: 0, fragment: 0, compute: 0 };
+		this.bindingsArray = null;
 		this.attributes = [];
 		this.bufferAttributes = [];
 		this.varyings = [];
@@ -93,6 +96,22 @@ class NodeBuilder {
 
 	}
 
+	getBindings() {
+
+		let bindingsArray = this.bindingsArray;
+
+		if ( bindingsArray === null ) {
+
+			const bindings = this.bindings;
+
+			this.bindingsArray = bindingsArray = ( this.material !== null ) ? [ ...bindings.vertex, ...bindings.fragment ] : bindings.compute;
+
+		}
+
+		return bindingsArray;
+
+	}
+
 	setHashNode( node, hash ) {
 
 		this.hashNodes[ hash ] = node;

examples/jsm/nodes/display/ViewportSharedTextureNode.js

@@ -3,7 +3,7 @@ import { addNodeClass } from '../core/Node.js';
 import { addNodeElement, nodeProxy } from '../shadernode/ShaderNode.js';
 import { viewportTopLeft } from './ViewportNode.js';
 
-let rtt = null;
+let sharedFramebuffer = null;
 
 class ViewportSharedTextureNode extends ViewportTextureNode {
 
@@ -13,9 +13,9 @@ class ViewportSharedTextureNode extends ViewportTextureNode {
 
 	}
 
-	constructRTT( builder ) {
+	constructFramebuffer( builder ) {
 
-		return rtt || ( rtt = builder.getRenderTarget() );
+		return sharedFramebuffer || ( sharedFramebuffer = super.constructFramebuffer( builder ) );
 
 	}
 

examples/jsm/nodes/display/ViewportTextureNode.js

@@ -3,50 +3,56 @@ import { NodeUpdateType } from '../core/constants.js';
 import { addNodeClass } from '../core/Node.js';
 import { addNodeElement, nodeProxy } from '../shadernode/ShaderNode.js';
 import { viewportTopLeft } from './ViewportNode.js';
-import { Vector2 } from 'three';
+import { Vector2, FramebufferTexture } from 'three';
 
-let size = new Vector2();
+const _size = new Vector2();
 
 class ViewportTextureNode extends TextureNode {
 
 	constructor( uv = viewportTopLeft, level = null ) {
 
 		super( null, uv, level );
 
-		this.rtt = null;
-
 		this.isOutputTextureNode = true;
 
 		this.updateBeforeType = NodeUpdateType.FRAME;
 
 	}
 
-	constructRTT( builder ) {
+	constructFramebuffer( /*builder*/ ) {
 
-		return builder.getRenderTarget();
+		return new FramebufferTexture();
 
 	}
 
 	construct( builder ) {
 
-		if ( this.rtt === null ) this.rtt = this.constructRTT( builder );
-
-		this.value = this.rtt.texture;
+		if ( this.value === null ) this.value = this.constructFramebuffer( builder );
 
 		return super.construct( builder );
 
 	}
 
 	updateBefore( frame ) {
 
-		const rtt = this.rtt;
-
 		const renderer = frame.renderer;
-		renderer.getDrawingBufferSize( size );
+		renderer.getDrawingBufferSize( _size );
+
+		//
+
+		const framebufferTexture = this.value;
+
+		if ( framebufferTexture.image.width !== _size.width || framebufferTexture.image.height !== _size.height ) {
+
+			framebufferTexture.image.width = _size.width;
+			framebufferTexture.image.height = _size.height;
+			framebufferTexture.needsUpdate = true;
+
+		}
 
-		rtt.setSize( size.width, size.height );
+		//
 
-		renderer.copyFramebufferToRenderTarget( rtt );
+		renderer.copyFramebufferToTexture( framebufferTexture );
 
 	}
 

examples/jsm/nodes/lighting/AnalyticLightNode.js

@@ -6,6 +6,7 @@ import { vec3 } from '../shadernode/ShaderNode.js';
 import { reference } from '../accessors/ReferenceNode.js';
 import { texture } from '../accessors/TextureNode.js';
 import { positionWorld } from '../accessors/PositionNode.js';
+//import { step } from '../math/MathNode.js';
 import { cond } from '../math/CondNode.js';
 import MeshBasicNodeMaterial from '../materials/MeshBasicNodeMaterial.js';
 
@@ -51,6 +52,9 @@ class AnalyticLightNode extends LightingNode {
 			const depthTexture = new DepthTexture();
 			depthTexture.minFilter = NearestFilter;
 			depthTexture.magFilter = NearestFilter;
+			depthTexture.image.width = shadow.mapSize.width;
+			depthTexture.image.height = shadow.mapSize.height;
+			//depthTexture.compareFunction = THREE.LessCompare;
 
 			rtt.depthTexture = depthTexture;
 
@@ -128,7 +132,7 @@ class AnalyticLightNode extends LightingNode {
 
 	}
 
-	update( frame ) {
+	update( /*frame*/ ) {
 
 		const { light } = this;
 

examples/jsm/nodes/lighting/HemisphereLightNode.js

@@ -14,8 +14,8 @@ class HemisphereLightNode extends AnalyticLightNode {
 
 		super( light );
 
-		this.lightPositionNode = objectPosition;
-		this.lightDirectionNode = objectPosition.normalize();
+		this.lightPositionNode = objectPosition( light );
+		this.lightDirectionNode = this.lightPositionNode.normalize();
 
 		this.groundColorNode = uniform( new Color() );
 

examples/jsm/nodes/utils/EquirectUVNode.js

@@ -1,5 +1,4 @@
 import TempNode from '../core/TempNode.js';
-import { negate } from '../math/MathNode.js';
 import { positionWorldDirection } from '../accessors/PositionNode.js';
 import { nodeProxy, vec2 } from '../shadernode/ShaderNode.js';
 import { addNodeClass } from '../core/Node.js';
@@ -16,10 +15,10 @@ class EquirectUVNode extends TempNode {
 
 	construct() {
 
-		const dir = negate( this.dirNode );
+		const dir = this.dirNode;
 
 		const u = dir.z.atan2( dir.x ).mul( 1 / ( Math.PI * 2 ) ).add( 0.5 );
-		const v = dir.y.clamp( - 1.0, 1.0 ).asin().mul( 1 / Math.PI ).add( 0.5 );
+		const v = dir.y.negate().clamp( - 1.0, 1.0 ).asin().mul( 1 / Math.PI ).add( 0.5 ); // @TODO: The use of negate() here could be an NDC issue.
 
 		return vec2( u, v );
 

examples/jsm/renderers/webgpu/WebGPUAnimation.js → examples/jsm/renderers/common/Animation.js

@@ -1,4 +1,4 @@
-class WebGPUAnimation {
+class Animation {
 
 	constructor() {
 
@@ -55,4 +55,4 @@ class WebGPUAnimation {
 
 }
 
-export default WebGPUAnimation;
+export default Animation;

examples/jsm/renderers/common/Attributes.js

@@ -0,0 +1,75 @@
+import DataMap from './DataMap.js';
+import { AttributeType } from './Constants.js';
+import { DynamicDrawUsage } from 'three';
+
+class Attributes extends DataMap {
+
+	constructor( backend ) {
+
+		super();
+
+		this.backend = backend;
+
+	}
+
+	delete( attribute ) {
+
+		const attributeData = super.delete( attribute );
+
+		if ( attributeData !== undefined ) {
+
+			this.backend.destroyAttribute( attribute );
+
+		}
+
+	}
+
+	update( attribute, type ) {
+
+		const data = this.get( attribute );
+
+		if ( data.version === undefined ) {
+
+			if ( type === AttributeType.VERTEX ) {
+
+				this.backend.createAttribute( attribute );
+
+			} else if ( type === AttributeType.INDEX ) {
+
+				this.backend.createIndexAttribute( attribute );
+
+			} else if ( type === AttributeType.STORAGE ) {
+
+				this.backend.createStorageAttribute( attribute );
+
+			}
+
+			data.version = this._getBufferAttribute( attribute ).version;
+
+		} else {
+
+			const bufferAttribute = this._getBufferAttribute( attribute );
+
+			if ( data.version < bufferAttribute.version || bufferAttribute.usage === DynamicDrawUsage ) {
+
+				this.backend.updateAttribute( attribute );
+
+				data.version = bufferAttribute.version;
+
+			}
+
+		}
+
+	}
+
+	_getBufferAttribute( attribute ) {
+
+		if ( attribute.isInterleavedBufferAttribute ) attribute = attribute.data;
+
+		return attribute;
+
+	}
+
+}
+
+export default Attributes;