[Dúvida] Seletor assíncrono e componente Suspense fazem o mesmo que o hook useEffect?

Olá.

No vídeo dessa aula, foi mostrado como criar um seletor assíncrono para obter os dados de evento de uma API e usar esse seletor como valor default de um átomo. Também foi usado o componente Suspense para aguardar a finalização da chamada assíncrona.

Por favor, gostaria de saber se essa abordagem não seria semelhante ao que fazemos ao utilizar o useEffect para obter dados quando um componente carrega. No caso do Recoil, isso é feito da maneira como mostrada no vídeo, ou é só uma das soluções?

Eu tentei fazer isso aplicando um useEffect no componente ListaDeEventos, mantendo o átomo listaDeEventosState vazio por default e sem usar o componente Suspense e, aparentemente, funcionou:

// atom.ts
export const listaDeEventosState = atom<IEvento[]>({
    key: 'listaDeEventosState',
    default: []
});

// componente ListaDeEventos
const setEventos = useSetRecoilState(listaDeEventosState);

useEffect(() => {
    // obtém os dados da API
    fetch('http://localhost:8080/eventos')
      .then(response => response.json())
      .then((data: IEvento[]) => setEventos(data.map(evento => ({
        ...evento,
        inicio: new Date(evento.inicio),
        fim: new Date(evento.fim),
      }))))
}, [])