I am building a movie app in React to practice.

In the homepage there is a big banner with movie poster and information about movies, content of this banner is changing every 5 seconds. I created this function for this:

```
 const [movie, setMovie] = useState('');     //const movie returns object of one random movie

  useEffect(() => {
    async function fetchData() {
      const request = await axios.get(requests.fetchNetflixOriginals);  
      setMovie(
        request.data.results[
          Math.floor(Math.random() * request.data.results.length)
        ]
      );
    }
    const interval = setInterval(() => {
      fetchData();
    }, 5000)
   return () => clearInterval(interval)   
  }, [movie]);

```

This solution has a problem: there is a 5sec delay when I run this app for the first time (caused by setInterval).

So my question is, if there is any solution to get the same behaviour, just without the delay at the start?

I tried a lot of different solutions including defining new states, but all of them causes bugs or infinite loop.

Thanks!