deden3791 / 2FA

1 stars 0 forks source link

Timer pauses when user types anagram answer #8

Closed LewisTrundle closed 6 months ago

LewisTrundle commented 6 months ago

Describe the bug

When a user is typing in the input box for the anagram answer, the timer pauses. This may have to do with a hook being updated upon every change to the input, causing react to re-render its current state.

A potential solution may be to remove the constant hook updates.

Expected behavior

The timer should be constant.

Priority

high

Time Estimate

< 1 hour

Extra Notes

matthewb98 commented 6 months ago

From my reading into this, we could try 'requestAnimationFrame()' [https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame] within the Timer useEffect () instead of using setInterval(). Unsure, but might help to ensure the browser handles the rendering more efficiently?

I've never used TypeScript, though, so one of you might want to try putting this in, or I'd be happy to pair with someone on this/other issues since I'm not much use on my own with no experience using JS/TS