Imparare React, 2a edizione

Capitolo 7. Migliorare i componenti con i ganci

Questo lavoro è stato tradotto utilizzando l'AI. Siamo lieti di ricevere il tuo feedback e i tuoi commenti: [e-mail]

Rendering è il cuore pulsante di un'applicazione React. Quando qualcosa cambia (oggetti di scena, stato), l'albero dei componenti viene renderizzato, riflettendo i dati più recenti come interfaccia utente. Finora, useState è stato il nostro cavallo di battaglia per descrivere il rendering dei nostri componenti. Ma possiamo fare di più. Ci sono altri ganci che definiscono le regole sul perché e sul quando deve avvenire il rendering. Ci sono altri hook che migliorano le prestazioni del rendering. Ci sono sempre altri hook che ci aiutano.

Nell'ultimo capitolo abbiamo introdotto useState, useRef e useContext e abbiamo visto che possiamo comporre questi ganci in ganci personalizzati: useInput e useColors. Ma non è finita qui. React è dotato di altri hook già pronti per l'uso. In questo capitolo daremo un'occhiata più da vicino a useEffect, useLayoutEffect e useReducer. Tutti questi sono fondamentali per la creazione di applicazioni. Inoltre, daremo un'occhiata a useCallback e useMemo, che possono aiutarci a ottimizzare le prestazioni dei nostri componenti.

Introduzione di useEffect

Su abbiamo una buona idea di cosa succede quando renderizziamo un componente. Un componente è semplicemente una funzione che esegue il rendering di un'interfaccia utente. Il rendering avviene quando l'applicazione viene ...