SESIUNEA 34

useCallback, useMemo, useReducer

 Memoization

Atentie: Termenul corect este memoization, nu memorization.

Cand vorbim despre memoization, ne referim la un proces de

caching al unei valori, pentru a evita recalcularea acesteia.

Acest proces, poate îmbunătăți performanța, in special in aplicații

de dimensiuni mai mari.
 useCallback si useMemo

Hook-urile useCallback si useMemo sunt similare, principala

diferenta fiind ca useCallback returnează o funcție cached, iar
useMemo returnează o valoare cached.
 useCallback

Cu ajutorul hook-ului useCallback, putem izola functiile, care

necesita mai multe resurse, astfel incat acestea sa nu fie
executate la fiecare rerender al componentei.

Functia se va executa, doar atunci cand dependintele lui

useCallback se actualizează.
 useMemo

Cu ajutorul hook-ului useMemo, putem memora o valoare, care de

exemplu poate fi returnata de o funcție intensiva, iar in acest mod
am preveni execuția acesteia atunci cand nu este necesara.

Valoarea se va actualiza, doar atunci cand dependintele lui

useMemo se actualizează.
 State Management

Până acum am folosit useState pentru a face managementul

state-ului pentru diverse valori.

Dacă dorim sa facem management al unui state ceva mai complex,

am ajunge sa avem multiple useState într-o singura componenta.
 useReducer

Aici ne vine in ajutor useReducer, deoarece cu ajutorul acestuia,

putem sa facem handling, folosind acțiuni, al unui state mai
complex.
useReducer
 useReducer

In loc sa avem multiple state-uri, folosind useReducer, putem in

funcție de acțiunea pe care o activam sa modificăm un singur
state mai complex.
Q&A
Vrei sa știi mai multe?

● useCallback
● useMemo
● useReducer
● React Redux