RenderObject: Fix geometry key for morph targets. (#30302)

* RenderObject: Fix geometry key for morph targets.

* RenderObject: Clean up.

* RenderObject: Improve cache key names.

docs/api/en/core/BufferAttribute.html

@@ -70,6 +70,9 @@
 		<h3>[property:Boolean isBufferAttribute]</h3>
 		<p>Read-only flag to check if a given object is of type [name].</p>
 
+		<h3>[property:Integer id]</h3>
+		<p>Unique number for this attribute instance.</p>
+
 		<h3>[property:Integer itemSize]</h3>
 		<p>
 			The length of vectors that are being stored in the

src/core/BufferAttribute.js

@@ -7,6 +7,8 @@ import { fromHalfFloat, toHalfFloat } from '../extras/DataUtils.js';
 const _vector = /*@__PURE__*/ new Vector3();
 const _vector2 = /*@__PURE__*/ new Vector2();
 
+let _id = 0;
+
 class BufferAttribute {
 
 	constructor( array, itemSize, normalized = false ) {
@@ -19,6 +21,8 @@ class BufferAttribute {
 
 		this.isBufferAttribute = true;
 
+		Object.defineProperty( this, 'id', { value: _id ++ } );
+
 		this.name = '';
 
 		this.array = array;

src/renderers/common/RenderObject.js

@@ -558,6 +558,26 @@ class RenderObject {
 
 		}
 
+		// structural equality isn't sufficient for morph targets since the
+		// data are maintained in textures. only if the targets are all equal
+		// the texture and thus the instance of `MorphNode` can be shared.
+
+		for ( const name of Object.keys( geometry.morphAttributes ).sort() ) {
+
+			const targets = geometry.morphAttributes[ name ];
+
+			cacheKey += 'morph-' + name + ',';
+
+			for ( let i = 0, l = targets.length; i < l; i ++ ) {
+
+				const attribute = targets[ i ];
+
+				cacheKey += attribute.id + ',';
+
+			}
+
+		}
+
 		if ( geometry.index ) {
 
 			cacheKey += 'index,';
@@ -641,12 +661,6 @@ class RenderObject {
 
 		}
 
-		if ( object.morphTargetInfluences ) {
-
-			cacheKey += object.morphTargetInfluences.length + ',';
-
-		}
-
 		if ( object.isBatchedMesh ) {
 
 			cacheKey += object._matricesTexture.uuid + ',';