Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

156
Visualizações
My react app freezes/lags on mobile devices

I created an app but it freezes on mobile devices, i don't know what is the issue.

The app on netlify : https://mlvo.netlify.app/

On computers it works very fine and it's fluid, but on mobile devices it works on landing in the page, but after 2/3 actions, it freezes.

Can someone help me please?

about 4 years ago · Juan Pablo Isaza
2 Respostas
Responde à pergunta

0

Opening your app and checking the console, you can see that it is not working fine on desktop either. There is an infinite console.log being called from Planning.js. enter image description here

You need to go back and look at what could be causing that. (Without seeing the code, this looks like an issue with useEffect causing an infinite rerender and hitting your console logs.)

The reason it may seem to be ok on a desktop is likely because desktops have more resources than phones, so you don't see as much performance drop-off from repeated console logs.

about 4 years ago · Juan Pablo Isaza Relatório

0

It looks there is a side effect that trigger your app to run in an infinite loop.

Why this behavior

You have 2 useEffects the first one which loads after the component mounts, that makes an api hit, and set your state to the response.data. the second one has the eventlist as one of it's dependencies, when the dependency change, react triggers another rerender, and hence the dependency change, and so on and so forth.

const [eventList, setEventList] = useState([]);
useEffect(() => {
    Axios.get('https://mlvo-planning.herokuapp.com/read').then((response) => {
      setEventList(response.data);
    })

  });

  useEffect(() => {
    if(eventList){
    eventList.map((l)=>{
      console.log(moment(l.eventDate, "DD-MM-YYYY").format("ddd DD MMM"));
    });
  }
  },[eventList]);

How to prevent this behavior?

The infinite loop is fixed by correct management of the useEffect(callback, dependencies) dependencies argument.

An efficient way to avoid the infinite loop is to properly manage the hook dependencies — control when exactly the side-effect should run.

I highly encourage you to read more about the useEffect hook

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda