WebGPURenderer: Improve clippingContext cachekey (#29232)

* fix clipping cache key and simplify versions

* lint fix

---------

Co-authored-by: aardgoose <angus.sawyer@email.com>

src/renderers/common/ClippingContext.js

@@ -4,13 +4,11 @@ import { Vector4 } from '../../math/Vector4.js';
 
 const _plane = /*@__PURE__*/ new Plane();
 
-let _clippingContextVersion = 0;
-
 class ClippingContext {
 
 	constructor() {
 
-		this.version = ++ _clippingContextVersion;
+		this.version = 0;
 
 		this.globalClippingCount = 0;
 
@@ -22,6 +20,7 @@ class ClippingContext {
 
 		this.parentVersion = 0;
 		this.viewNormalMatrix = new Matrix3();
+		this.cacheKey = '';
 
 	}
 
@@ -93,7 +92,12 @@ class ClippingContext {
 
 		}
 
-		if ( update ) this.version = _clippingContextVersion ++;
+		if ( update ) {
+
+			this.version ++;
+			this.cacheKey = `${ this.globalClippingCount }:${ this.localClippingEnabled === undefined ? false : this.localClippingEnabled }:`;
+
+		}
 
 	}
 
@@ -158,7 +162,12 @@ class ClippingContext {
 
 		}
 
-		if ( update ) this.version = _clippingContextVersion ++;
+		if ( update ) {
+
+			this.version += parent.version;
+			this.cacheKey = parent.cacheKey + `:${ this.localClippingCount }:${ this.localClipIntersection === undefined ? false : this.localClipIntersection }`;
+
+		}
 
 	}
 

src/renderers/common/RenderObject.js

@@ -235,7 +235,7 @@ export default class RenderObject {
 
 		}
 
-		cacheKey += this.clippingContextVersion + ',';
+		cacheKey += this.clippingContext.cacheKey + ',';
 
 		if ( object.skeleton ) {
 

src/renderers/webgpu/WebGPUBackend.js

@@ -1026,7 +1026,7 @@ class WebGPUBackend extends Backend {
 			data.sampleCount !== sampleCount || data.colorSpace !== colorSpace ||
 			data.colorFormat !== colorFormat || data.depthStencilFormat !== depthStencilFormat ||
 			data.primitiveTopology !== primitiveTopology ||
-			data.clippingContextVersion !== renderObject.clippingContextVersion
+			data.clippingContextCacheKey !== renderObject.clippingContext.cacheKey
 		) {
 
 			data.material = material; data.materialVersion = material.version;
@@ -1044,7 +1044,7 @@ class WebGPUBackend extends Backend {
 			data.colorFormat = colorFormat;
 			data.depthStencilFormat = depthStencilFormat;
 			data.primitiveTopology = primitiveTopology;
-			data.clippingContextVersion = renderObject.clippingContextVersion;
+			data.clippingContextCacheKey = renderObject.clippingContext.cacheKey;
 
 			needsUpdate = true;
 
@@ -1074,7 +1074,7 @@ class WebGPUBackend extends Backend {
 			utils.getSampleCountRenderContext( renderContext ),
 			utils.getCurrentColorSpace( renderContext ), utils.getCurrentColorFormat( renderContext ), utils.getCurrentDepthStencilFormat( renderContext ),
 			utils.getPrimitiveTopology( object, material ),
-			renderObject.clippingContextVersion
+			renderObject.clippingContext.cacheKey
 		].join();
 
 	}