Conservare valori senza eseguire nuovamente il rendering

Obiettivo: Memorizzare valori che persistono tra i rendering senza causare un nuovo rendering. useRef fornisce un contenitore stabile .current.

• Persiste tra i rendering
• Non causa un nuovo rendering quando cambia
• È ideale per timer e valori precedenti

Gli aggiornamenti di useState causano un nuovo rendering dell'interfaccia. Gli aggiornamenti di useRef no. Scelga una ref per gli helper mutabili (id, contatori per la logica), non per i dati dell'interfaccia.

Incrementiamo un renderCount in un effetto e lo conserviamo in una ref; persiste tra i rendering, ma non li attiva.

Usi appropriati:

• Id di timer/intervalli
• Cache dei valori precedenti
• Flag tra un rendering e l'altro (ad esempio, isMounted)

Non per: dati che devono comparire nell'interfaccia.

Conserviamo l'id dell'intervallo in una ref per poter avviare e arrestare il timer senza ulteriori rendering.

Problemi comuni:

• Non legga una ref per controllare l'interfaccia senza usare lo stato: l'interfaccia non si aggiornerà.
• Reimposti le ref durante l'unmount se contengono id o risorse.
• Eviti di usare eccessivamente le ref come contenitori globali.

Riepilogo: Utilizzi useRef per i valori mutabili che persistono tra i rendering, come id, valori precedenti o flag, senza causare nuovi rendering. Utilizzi lo stato per l'interfaccia visibile.