Me ya sa mahimmaciAn jiyya a cikin sarrafa jihar?

Question

Accepted Answer

**Jiyya** yana nufin cewa ba ka bada jiya a waje — a saita, kana aikin **sabuwa** object/array tare da sauyi. Wannan shine mahimmancin aiki yadda React, Redux, da kayan iri na kamannensa suka gane jiya kuma suka sabunta UI gida.

## Matsalar tare da jiya

```jsx
// ❌ mutating — React doesn't detect the change
function addItem(item) {
  items.push(item);   // same array reference → React sees "no change" → no re-render
  setItems(items);    // passing the same reference back
}

// ✅ immutable — a NEW array, new reference → React re-renders
function addItem(item) {
  setItems([...items, item]); // create a new array
}
```

React (da Redux) sun gane jiya ta hanyar kwatanta **nassoshi** (`oldState === newState`), ba zurfin abubuwan ba — don gogewa. Idan ka bada jiya a waje, nassoshi zai ci gida daidai, saboda haka framework yana tunani cewa babu komai ya canza kuma ya tsokaita sake watse.

## Tsare-tsaren sabunta jiyya

```js
// arrays
setItems([...items, newItem]);                  // add
setItems(items.filter(i => i.id !== id));        // remove
setItems(items.map(i => i.id === id ? { ...i, done: true } : i)); // update one

// objects
setUser({ ...user, name: "Bob" });               // update a field
setUser({ ...user, address: { ...user.address, city: "NY" } }); // nested update
```

Oper spread yana haifar da shallafu sannu daya; don bayanai da suke daga ciki ana kwafowa kowane matakin da ka canza.

## Me ya sa jiyya ta kawo da ɗari

```text
✓ Reliable change detection → correct, efficient re-renders (reference equality)
✓ Enables performance optimizations (React.memo, OnPush, useMemo) that compare references
✓ Predictable state — old state is never altered, easing debugging
✓ Time-travel debugging & undo/redo (keep past state snapshots)
```

## Kayan da ke taimakawa

```js
// Immer (used by Redux Toolkit) lets you "mutate" a draft → produces an immutable result
produce(state, draft => { draft.items.push(item); }); // safe + readable
```

Immer ya sa sabunta jiyya daga ciki abin koyi ta hanyar ba ka damar rubutu kalil da jiya kan waje wanda ya canza shi zuwa sabunta jiyya.

## Me ya sa yana mahimmanci

Jiyya shine hanyar da suke gana jiya ta hanyar nassoshi — ita ce *me* da ya sa `[...items]` yana watse kuma `items.push()` ba.

Bayan gida, yana bubugar hanyoyin gogewa (tunani kwatanta nassoshi) da kyakkyawan gida (kunna/sake yin, lokaci-tafiya).

Gaske da'a ikon kalil koyar (da kayan irin Immer) shine dole ga aiki daidai da React/Redux; bada jiya shine daya daga cikin mafi yawan rashin kyau na masu farawa.