No estoy seguro de si me estoy perdiendo algo aquí, pero un bucle while muy simple congela la página.

Comprobado:

La consola inició sesión dentro de useEffect para verificar si el componente se vuelve a renderizar de manera inusual, pero ese no es el caso.

 function IterationComponent() { const [c1, incrementC1] = useState(() => 0); const [c2, incrementC2] = useState(() => 0); useEffect(() => { console.log(1) }); function incrementC1Fn () { incrementC1(prevValue => prevValue + 1) } function incrementC2Fn () { incrementC2(prevValue => prevValue + 1) } const isEven = () => { let i = 0; while(i < 2); i++ return c1 % 2 === 0; } return ( <> <button onClick={incrementC1Fn}>C1 - {c1}</button> <button onClick={incrementC2Fn}>C2 - {c2}</button> <span>{isEven() ? 'Even' : 'Odd'}</span> </> ) }

Cada vez que agrego el bucle while dentro de la función isEven, la página se congela porque no puedo hacer clic en ningún botón

NOTA : No me pregunte por qué estoy haciendo algo como esto o cuál es el propósito de esto o puedo hacerlo de alguna otra manera para aumentar el rendimiento. Esto es solo para mi comprensión, ya que quiero hacer deliberadamente que la función isEven funcione lentamente. Es solo con fines educativos. Pero creo que este ciclo while simple no debería congelar la página a menos que esté haciendo algo mal aquí.