X'inhu useEffect u meta jitħaqqaq?

Question

Accepted Answer

`useEffect` jitħaqqaq **side effects** — xogħol li jilħaq barra mir-rendering ta' React, bħall-fetching tad-data, subscriptions, timers, jew aġġornamenti manuali tad-DOM. Jitħaqqaq **wara** li l-component jirrender, iżomm il-side effects barra mill-body tar-render (render għandu jibqa' pure).

## L-array ta' dipendenza jikkonttrolla t-timing

```jsx
useEffect(() => {
  document.title = `Count: ${count}`;
}, [count]); // ← dependency array
```

- **`[count]`** → jitħaqqaq wara l-ewwel render u kull meta `count` inbidel.
- **`[]`** (vojt) → jitħaqqaq **darba** wara mount (tajjeb għall-setup b'darba).
- **omitted** → jitħaqqaq wara **kull** render (rari dak li trid).

## Cleanup: irrigorna funzjoni

If an effect iħaqqaq xi ħaġa li trid tittejb, irrigorna cleanup function. React jichjamataha qabel ir-run tal-effect li jmiss u meta l-component jimmontwi:

```jsx
useEffect(() => {
  const id = setInterval(() => setN(n => n + 1), 1000);
  return () => clearInterval(id); // cleanup → prevents a leaked timer
}, []);
```

## Għaliex cleanup importanti

Bdun tiegħu, kull re-run kien iżid timer/subscription oħra u qatt ma jneħħi l-waħda l-antika — memory leak klassiku. Il-lifecycle għal effect `[dep]` huwa: *itħaqqaq effect → (dep inbidel) → itħaqqaq cleanup → itħaqqaq effect mill-ġdid*.

**Tip:** m'għandekx tużża effects għal ħaġat li tista' tikkomputa matul ir-render (derive values minflok), u inkludu kull valur li l-effect jaqra fl-array ta' dipendenza (ir-regola lint `react-hooks/exhaustive-deps` tgħin).