Fix invisible model on load by populating meshCache synchronously with useMemo
Build and Deploy / build-and-push (push) Successful in 1m3s
Build and Deploy / build-and-push (push) Successful in 1m3s
This commit is contained in:
@@ -203,7 +203,21 @@ export const ModelViewer = forwardRef<THREE.Group, ModelViewerProps>(({ object,
|
||||
const internalRef = useRef<THREE.Group>(null);
|
||||
const groupRef = (ref as any) || internalRef;
|
||||
const textureCache = useRef<Map<string, THREE.Texture>>(new Map());
|
||||
const meshCache = useRef<Map<string, THREE.Mesh>>(new Map());
|
||||
|
||||
const meshCache = useMemo(() => {
|
||||
const cache = new Map<string, THREE.Mesh>();
|
||||
if (object) {
|
||||
let mIdx = 0;
|
||||
object.traverse((child) => {
|
||||
if (child instanceof THREE.Mesh) {
|
||||
const stableId = `mesh-${mIdx}`;
|
||||
cache.set(stableId, child);
|
||||
mIdx++;
|
||||
}
|
||||
});
|
||||
}
|
||||
return cache;
|
||||
}, [object]);
|
||||
|
||||
useTexturePipeline(object);
|
||||
|
||||
@@ -212,25 +226,9 @@ export const ModelViewer = forwardRef<THREE.Group, ModelViewerProps>(({ object,
|
||||
return () => {
|
||||
textureCache.current.forEach(tex => tex.dispose());
|
||||
textureCache.current.clear();
|
||||
meshCache.current.clear();
|
||||
};
|
||||
}, []);
|
||||
|
||||
// Build mesh cache when object changes
|
||||
useEffect(() => {
|
||||
meshCache.current.clear();
|
||||
if (object) {
|
||||
let mIdx = 0;
|
||||
object.traverse((child) => {
|
||||
if (child instanceof THREE.Mesh) {
|
||||
const stableId = `mesh-${mIdx}`;
|
||||
meshCache.current.set(stableId, child);
|
||||
mIdx++;
|
||||
}
|
||||
});
|
||||
}
|
||||
}, [object]);
|
||||
|
||||
// Main transform update for the core model
|
||||
useEffect(() => {
|
||||
if (object && sceneObjects) {
|
||||
@@ -254,13 +252,13 @@ export const ModelViewer = forwardRef<THREE.Group, ModelViewerProps>(({ object,
|
||||
useEffect(() => {
|
||||
if (object && sceneObjects) {
|
||||
const activeIds = new Set(sceneObjects.map(obj => obj.id));
|
||||
meshCache.current.forEach((mesh, id) => {
|
||||
meshCache.forEach((mesh, id) => {
|
||||
if (!activeIds.has(id)) {
|
||||
mesh.visible = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
}, [object, sceneObjects]);
|
||||
}, [object, sceneObjects, meshCache]);
|
||||
|
||||
if (!object) return null;
|
||||
|
||||
@@ -270,7 +268,7 @@ export const ModelViewer = forwardRef<THREE.Group, ModelViewerProps>(({ object,
|
||||
<group ref={groupRef}>
|
||||
<primitive object={object} />
|
||||
{meshObjects.map(obj => {
|
||||
const mesh = meshCache.current.get(obj.id);
|
||||
const mesh = meshCache.get(obj.id);
|
||||
if (!mesh) return null;
|
||||
return (
|
||||
<group key={obj.id}>
|
||||
|
||||
Reference in New Issue
Block a user