Este puede ser un problema muy común o fácil de resolver, pero soy muy nuevo en React (comencé hoy) y no estoy al tanto.

Estoy tratando de construir una aplicación simple de clics por segundo . Básicamente, una aplicación que cuenta cuántos clics haces por segundo. Entonces, cuando la persona comienza a hacer clic en el botón, se inicia un temporizador y, al final, divido clics/segundos . El problema es que el temporizador se ralentiza cuando empiezo a hacer clic más rápido.

Aquí hay una versión simplificada de mi código:

 function Clicker() { const [clicks, setClicks] = useState(0); const [milliSeconds, setMilliSeconds] = useState(0); const [storeMilliSeconds, setStoreMilliSeconds] = useState(0); const [seconds, setSeconds] = useState(0); const [startTimer, setStartTimer] = useState(false); const clickerHandler = () => { setEffect(true); setStartTimer(true); setClicks(clicks + 1); }; useEffect(() => { if (seconds === 10 && milliSeconds === 0) { setStartTimer(false); } if (startTimer === true) { const interval = setInterval(() => { setMilliSeconds((milliSeconds) => milliSeconds + 1); setStoreMilliSeconds((storeMilliSeconds) => storeMilliSeconds + 1); if (milliSeconds === 9) { setSeconds((seconds) => seconds + 1); setMilliSeconds(0); } }, 100); return () => clearInterval(interval); } return console.log( "nothing happening" ); }); return ( <button onClick={clickerHandler} > There's only one way to find out... </button>

Estoy muy agradecido por la ayuda que puedo obtener, gracias!