𝗣𝗿𝗶𝗻𝗰𝗶𝗽𝗶 𝗱𝗲𝗶 𝗥𝗲𝗮𝗰𝘁 𝗛𝗼𝗼𝗸
Smetti di usare useEffect per tutto. Molti sviluppatori usano impropriamente questo hook. Ciò crea bug e rende il codice difficile da leggere.
Limita l'uso di useEffect.
Cerca di usare un solo useEffect per pagina. Usare molti hook per lo stesso stato crea confusione. Si perde il conto di quale hook aggiorni quale stato.
Smetti di usare useEffect per gli eventi dell'utente.
Non usare useEffect per click o tap. Usa invece gli event handler.
- Errato: Usare useEffect per aggiornare lo stato dopo un click.
- Corretto: Usa una funzione come onClickBar per aggiornare lo stato.
Tipi di eventi che dovresti conoscere:
- Navigazione della pagina e render iniziali.
- Cambiamenti della connessione di rete.
- Aggiornamenti WebSocket o del server in tempo reale.
Le azioni dell'utente come i click non dovrebbero stare in useEffect. Usa handler di eventi diretti per queste azioni.
Dividi i componenti in base alle props.
Se usi una prop booleana per cambiare la logica, dividi il tuo componente. Non costruire un unico componente che gestisca sia la creazione che l'aggiornamento dei dati.
Un singolo componente con molti statement "if" diventa troppo grande. Questo rende l'app difficile da mantenere.
- Errato: Un unico componente con una prop "isAdd" che cambia i campi del modulo.
- Corretto: Crea un "RegisterComponent" e un "UpdateComponent".
I componenti piccoli sono più facili da testare. Sono più veloci. Rimangono puliti.
Fonte: https://dev.to/kkr0423/reactjs-the-principle-of-the-hook-3c31