Nodes: Introduce `Node.needsUpdate=true` (#27904)

* Background: Fix backgroundNode changed after first renderer

* RenderObject: cleanup clippingNeedsUpdate

* Nodes: Add `.needsUpdate=true`

* Rename _version  -> _cacheKeyVersion

examples/jsm/nodes/core/Node.js

@@ -20,12 +20,27 @@ class Node extends EventDispatcher {
 
 		this.uuid = MathUtils.generateUUID();
 
+		this.version = 0;
+
+		this._cacheKey = null;
+		this._cacheKeyVersion = 0;
+
 		this.isNode = true;
 
 		Object.defineProperty( this, 'id', { value: _nodeId ++ } );
 
 	}
 
+	set needsUpdate( value ) {
+
+		if ( value === true ) {
+
+			this.version ++;
+
+		}
+
+	}
+
 	get type() {
 
 		return this.constructor.type;
@@ -80,9 +95,18 @@ class Node extends EventDispatcher {
 
 	}
 
-	getCacheKey() {
+	getCacheKey( force = false ) {
+
+		force = force || this.version !== this._cacheKeyVersion;
+
+		if ( force === true || this._cacheKey === null ) {
+
+			this._cacheKey = getCacheKey( this, force );
+			this._cacheKeyVersion = this.version;
+
+		}
 
-		return getCacheKey( this );
+		return this._cacheKey;
 
 	}
 

examples/jsm/nodes/core/NodeUtils.js

@@ -1,6 +1,6 @@
 import { Color, Matrix3, Matrix4, Vector2, Vector3, Vector4 } from 'three';
 
-export function getCacheKey( object ) {
+export function getCacheKey( object, force = false ) {
 
 	let cacheKey = '{';
 
@@ -12,7 +12,7 @@ export function getCacheKey( object ) {
 
 	for ( const { property, childNode } of getNodeChildren( object ) ) {
 
-		cacheKey += ',' + property.slice( 0, - 4 ) + ':' + childNode.getCacheKey();
+		cacheKey += ',' + property.slice( 0, - 4 ) + ':' + childNode.getCacheKey( force );
 
 	}
 

examples/jsm/renderers/common/Background.js

@@ -50,11 +50,11 @@ class Background extends DataMap {
 
 			if ( backgroundMesh === undefined ) {
 
-				const backgroundMeshNode = context( vec4( backgroundNode ), {
+				const backgroundMeshNode = context( vec4( backgroundNode ).mul( backgroundIntensity ), {
 					// @TODO: Add Texture2D support using node context
 					getUV: () => normalWorld,
 					getTextureLevel: () => backgroundBlurriness
-				} ).mul( backgroundIntensity );
+				} );
 
 				let viewProj = modelViewProjection();
 				viewProj = viewProj.setZ( viewProj.w );

examples/jsm/renderers/common/RenderObject.js

@@ -1,4 +1,4 @@
-import ClippingContext from "./ClippingContext.js";
+import ClippingContext from './ClippingContext.js';
 
 let id = 0;
 
@@ -75,7 +75,7 @@ export default class RenderObject {
 
 	}
 
-	clippingNeedsUpdate () {
+	get clippingNeedsUpdate() {
 
 		if ( this.clippingContext.version === this.clippingContextVersion ) return false;
 
@@ -192,7 +192,7 @@ export default class RenderObject {
 
 	get needsUpdate() {
 
-		return this.initialNodesCacheKey !== this.getNodesCacheKey();
+		return this.initialNodesCacheKey !== this.getNodesCacheKey() || this.clippingNeedsUpdate;
 
 	}
 

examples/jsm/renderers/common/RenderObjects.js

@@ -33,7 +33,7 @@ class RenderObjects {
 
 			renderObject.updateClipping( renderContext.clippingContext );
 
-			if ( renderObject.version !== material.version || renderObject.needsUpdate || renderObject.clippingNeedsUpdate() ) {
+			if ( renderObject.version !== material.version || renderObject.needsUpdate ) {
 
 				if ( renderObject.initialCacheKey !== renderObject.getCacheKey() ) {