From 4922ecfaeaafd4eb8e69ca97132133cca6780fb0 Mon Sep 17 00:00:00 2001
From: "sweep-ai[bot]" <128439645+sweep-ai[bot]@users.noreply.github.com>
Date: Mon, 7 Aug 2023 11:34:17 +0200
Subject: [PATCH] Improve performance of confetti component (#24)
* Update src/Experience.jsx
* Update src/Components/Confetti.jsx
* Update src/Components/Confetti.jsx
* Update src/Experience.jsx
* Update src/Experience.jsx
* Update src/Experience.jsx
---------
Co-authored-by: sweep-ai[bot] <128439645+sweep-ai[bot]@users.noreply.github.com>
---
src/Components/Confetti.jsx | 22 +++++++++++-----------
src/Experience.jsx | 11 +++++++----
2 files changed, 18 insertions(+), 15 deletions(-)
diff --git a/src/Components/Confetti.jsx b/src/Components/Confetti.jsx
index 5b7c892..45b4de5 100644
--- a/src/Components/Confetti.jsx
+++ b/src/Components/Confetti.jsx
@@ -94,32 +94,32 @@ export default function ExplosionConfetti(
useFrame(() => {
if (isExploding && Math.random() < rate) explode()
-
+
let particleAmount = 0
-
+
for (let i = 0; i < booms.length; i++) {
const boom = booms[i]
-
+
for (let k = 0; k < boom.children.length; k++) {
let particle = boom.children[k]
-
+
particle.destination.y -= THREE.MathUtils.randFloat(0.1, 0.3)
particle.life -= THREE.MathUtils.randFloat(0.005, 0.01)
-
+
const speedX = (particle.destination.x - particle.position.x) / 200
const speedY = (particle.destination.y - particle.position.y) / 200
const speedZ = (particle.destination.z - particle.position.z) / 200
-
+
particle.position.x += speedX
particle.position.y += speedY
particle.position.z += speedZ
-
+
particle.rotation.y += particle.rotateSpeedY
particle.rotation.x += particle.rotateSpeedX
particle.rotation.z += particle.rotateSpeedZ
-
+
particle.material.opacity -= THREE.MathUtils.randFloat(0.005, 0.01)
-
+
if (particle.position.y < -fallingHeight) {
particle.material.dispose()
particle.geometry.dispose()
@@ -127,7 +127,7 @@ export default function ExplosionConfetti(
particle = null
}
}
-
+
if (boom.children.length <= 0) {
boom.dispose()
setBooms(booms.filter((b) => b !== boom))
@@ -137,4 +137,4 @@ export default function ExplosionConfetti(
})
return
-}
+}
\ No newline at end of file
diff --git a/src/Experience.jsx b/src/Experience.jsx
index 8b1ef0d..ad1fdb8 100644
--- a/src/Experience.jsx
+++ b/src/Experience.jsx
@@ -17,23 +17,26 @@ const Experience = () => {
})
const [isExploding, setIsExploding] = useState()
+ const [prevScore, setPrevScore] = useState(0);
+
useEffect(() => {
const unsuscribeIsScored = useGame.subscribe(
(state) => state.score,
(score) => {
- if(score) {
+ if(score != prevScore) {
setIsExploding(true)
setTimeout(() => {
setIsExploding(false)
}, 2000)
+ setPrevScore(score);
}
}
)
-
+
return () => {
unsuscribeIsScored()
}
- }, [])
+ }, [prevScore])
return <>
@@ -85,4 +88,4 @@ const Zoom = () => {
return <>>
}
-export default Experience
+export default Experience
\ No newline at end of file