Ola, usar o parâmetro de dependências irai depender da sua lógica!
O que é um "array de dependências"?
O "array de dependências" é o segundo argumento que você passa para certos hooks do React, como useEffect, useCallback, e useMemo. Ele é uma lista de valores que o React observa para determinar quando a função do hook deve ser executada novamente. O array de dependências é uma maneira de informar ao React quais valores influenciam a lógica dentro do hook.
useEffect(() => {
// Efeito colateral aqui
}, [dependency1, dependency2, ...]);
Por que devo fornecer um "array de dependências"?
Controle de Reexecução:
Ao fornecer um array de dependências, você controla quando o efeito deve ser reexecutado. O React reexecuta o efeito apenas quando algum dos valores no array muda. Isso pode melhorar o desempenho ao evitar execuções desnecessárias do efeito.
Evitar Loops Infinitos:
Sem um array de dependências, o efeito é executado após cada renderização, o que pode causar loops infinitos e problemas de desempenho. Especificar dependências evita esse problema, pois o efeito só é executado quando realmente necessário.
Melhoria de Desempenho:
Reduz a carga computacional ao garantir que os cálculos e efeitos sejam realizados somente quando necessário. Isso ajuda a manter a aplicação mais rápida e eficiente.
Claridade e Manutenção do Código:
O array de dependências torna o código mais previsível e fácil de entender. Ele explicita quais valores o efeito depende, facilitando a manutenção e evitando bugs.
Exemplos simples usados com frequência!
useEffect sem dependências:
useEffect(() => {
// Este efeito é executado após cada renderização
console.log('Renderizou!');
});
useEffect com array de dependências:
useEffect(() => {
// Este efeito é executado apenas quando count ou data mudam
console.log('Count ou data mudou!');
}, [count, data]);