animejs - the animation only plays again when useEffect is used

Question

During the first rendering, an animation written in this way plays correctly:

const Page = () => {

   anime({
      duration: 5000,
      targets: '#welcome-text, #welcome-lower-text',
      opacity: 1,
      delay: 3250,
    });

   return <h1>Hi guys</h1>
}

Unfortunately, after switching the browser tab and going back (or any other way to refocus the page again) the animation doesn't play.

The problem disappears when I use useEffect without the dependency array:

const Page = () => {

  useEffect(() => {
    anime({
      duration: 5000,
      targets: '#welcome-text, #welcome-lower-text',
      opacity: 1,
      delay: 3250,
    });
 }
 
   return <h1>Hi guys</h1>
}

Now the animation is played every time the user returns to the page or focuses it again.

What is the cause? Why does useEffect fix this?