score:2

Accepted answer

you wont need setinterval. let useeffect run only when the timer changes and this is done by passing the timer as argument.

this link describe how to optimize useeffect

const [timer, settimer] = usestate(10000);

function settimertonewvalue() {
  settimer(timer - 100);
}

useeffect(() => {
  if (timer > 6000) {
    settimertonewvalue();
  }
}, [timer]);
console.log(timer);

in this example useeffect will execute as soon as timer changes.

here is another implementation with setinterval

function settimertonewvalue() {
  settimer((timer) => timer - 100);
}

useeffect(() => {
  let z;
  if (timer > 6000) {
    z = setinterval(() => {
      settimertonewvalue();
    }, 1000);
  }

  return () => clearinterval(z);
}, [timer]);

demo here

score:1

if you have to use timer you can use this code

export default function timer() {
    const [timer, settimer] = usestate(10000);
 
    useeffect(() => {
        console.log(timer)
        const interval = setinterval(() => {
            if (timer>6000)
            settimer(timer => timer - 1000);
        }, 1000);
        return () => clearinterval(interval);
    })
}

Related Query

More Query from same tag