En React, un componente se vuelve a renderizar cada vez que hay un cambio en su estado o en uno de sus accesorios.
La razón por la que se comporta de esta manera es para que sea posible "reaccionar" a un cambio en los datos mencionados y reflejar los cambios de la interfaz de usuario en consecuencia.

Cada vez que el componente se vuelve a renderizar, también lo hace cualquier lógica dentro de él que no esté en caché (funciones, variables, etc.)

useEffect nos ayuda a reaccionar a un cambio en el estado o accesorios que se indican en su matriz de dependencia.
Nos da la opción de ejecutar automáticamente una función de devolución de llamada en tal evento/s.

useEffect con una matriz de dependencia vacía, se ejecutará solo una vez cuando se monte el componente.

Así que en este ejemplo -

 function myComponent() { // some states, variables useEffect(() => { // do something on mount <= this is my current concern. }, [/* empty */]); // return Element ... }

La función de devolución de llamada dentro de useEffect se ejecutará solo una vez, cuando el componente "cobre vida" por primera vez.
Los renderizados posteriores no invocarán esto.

Mientras que en este ejemplo -

 function myComponent() { // some states, variables // do something on mount <= this is my current concern. // return Element ... }

Lo que sea que coloque allí se ejecutará cada vez que el componente se vuelva a renderizar.
Si esto está bien o no, depende de su caso de uso y de qué función está tratando de ejecutar, si es "económico" de ejecutar o no, etc.

Se ejecutarán cada vez que se vuelva a renderizar el componente si los pone en función directamente

Como mencionó, cuando tiene una dependencia vacía (como a continuación), el código interno solo se ejecutará en el montaje.

 useEffect(() => { something() // only runs on mount }, []);

Si no tiene un useEffect en absoluto, el código se ejecutará cada vez que se vuelva a procesar el componente.

 function myComponent() { // some states, variables something() // runs on every rerender // return ... }

Ahora la pregunta es, "¿cuándo sucede un renderizado?". En general, cada vez que se renderiza un componente principal, React volverá a renderizar todos los elementos secundarios de ese componente. Por lo tanto, los renderizados pueden ocurrir con bastante frecuencia.

Mire este artículo , que tiene algunos ejemplos visuales realmente útiles de cuándo se vuelven a renderizar los componentes.