cdnutter
/
Mario-Kart-3.js
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(game): fixed state management causing a rerender stuttered trigger when drifting

instancedMeshParticles
Alex 2024-01-25 11:49:42 +01:00
parent 2d9230b8ea
commit fdd821e630
4 changed files with 30 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/DriftParticlesLeft.jsx
View File

@ -3,9 +3,9 @@ import { Particles3 } from "./Particles3";
export const DriftParticlesLeft = ({turboColor,scale, ...props}) => {
if(scale < 0.8) {
return null;
}
// if(scale < 0.8) {
// return null;
// }
return (
<group {...props}>

6
src/components/DriftParticlesRight.jsx
View File

@ -3,9 +3,9 @@ import { Particles4 } from "./Particles4";
export const DriftParticlesRight = ({turboColor,scale, ...props}) => {
if(scale < 0.8) {
return null;
}
// if(scale < 0.8) {
// return null;
// }
return (
<group {...props}>

14
src/components/Particles1.jsx
View File

@ -13,6 +13,17 @@ export const Particles1 = ({ turboColor, scale, numParticles = 50, ...props }) =
}, [numParticles]);
useFrame((state, delta) => {
if (!instancedMeshRef.current) {
return;
}
// Manage visibility directly in the animation loop
instancedMeshRef.current.visible = scale >= 0.8;
if (scale < 0.8) {
return;
}
const deltaScaled = delta * 144; // Scale for 144 FPS
particlesData.forEach((particle, i) => {
particle.velocity.y += particle.gravity * deltaScaled;
@ -25,7 +36,6 @@ export const Particles1 = ({ turboColor, scale, numParticles = 50, ...props }) =
particle.position.set(-0.6, 0.05, 0.5);
particle.velocity.set(-Math.random() * 0.05, Math.random() * 0.05, Math.random() * 0.02);
}
const matrix = new THREE.Matrix4();
matrix.setPosition(particle.position);
instancedMeshRef.current.setMatrixAt(i, matrix);
@ -35,7 +45,7 @@ export const Particles1 = ({ turboColor, scale, numParticles = 50, ...props }) =
});
return (
<instancedMesh ref={instancedMeshRef} args={[null, null, numParticles]}>
<instancedMesh ref={instancedMeshRef} args={[null, null, numParticles]} visible={scale >= 0.8}>
<sphereGeometry args={[0.01, 16, 16]} />
<meshStandardMaterial
emissive={turboColor}

14
src/components/Particles2.jsx
View File

@ -13,6 +13,17 @@ export const Particles2 = ({ turboColor, scale, numParticles = 50, ...props }) =
}, [numParticles]);
useFrame((state, delta) => {
if (!instancedMeshRef.current) {
return;
}
// Manage visibility directly in the animation loop
instancedMeshRef.current.visible = scale >= 0.8;
if (scale < 0.8) {
return;
}
const deltaScaled = delta * 144; // Scale for 144 FPS
particlesData.forEach((particle, i) => {
particle.velocity.y += particle.gravity * deltaScaled;
@ -25,7 +36,6 @@ export const Particles2 = ({ turboColor, scale, numParticles = 50, ...props }) =
particle.position.set(0.6, 0.05, 0.5);
particle.velocity.set(Math.random() * 0.05, Math.random() * 0.05, Math.random() * 0.02);
}
const matrix = new THREE.Matrix4();
matrix.setPosition(particle.position);
instancedMeshRef.current.setMatrixAt(i, matrix);
@ -35,7 +45,7 @@ export const Particles2 = ({ turboColor, scale, numParticles = 50, ...props }) =
});
return (
<instancedMesh ref={instancedMeshRef} args={[null, null, numParticles]}>
<instancedMesh ref={instancedMeshRef} args={[null, null, numParticles]} visible={scale >= 0.8}>
<sphereGeometry args={[0.01, 16, 16]} />
<meshStandardMaterial
emissive={turboColor}