Vipi ni selectors na memoization katika usimamizi wa serikali?

Question

Accepted Answer

**Selector** ni kazi inayoandika (inatoka) sehemu maalum ya data kutoka kwa serikali**. **Memoization** inakamatia matokeo ya selector ili iwereze tena tu wakati pembejeo yake inabadilika — muhimu kwa utendaji wakati wajenzi wanafanya kazi ghali au kuepuka picha za aidinamizi zisizohitajika.

## Wajenzi wa msingi — fungeza ufahamu wa serikali

```js
// a selector knows HOW to pull a value out of the state shape
const selectUser = state => state.user;
const selectCartItems = state => state.cart.items;
const selectCartTotal = state =>
  state.cart.items.reduce((sum, i) => sum + i.price, 0); // derived
```

Wajenzi wanakusanya maarifa ya muundo wa serikali — vipengele vinaomba `selectCartTotal(state)` bila kujua mahali/jinsi inavyohifadhiwa, kwa hivyo kama muundo wa serikali unabadilika, sasisha selector moja, sio kila sehemu.

## Tatizo: wajenzi wanotokeana wanahesabika tena kila wakati wa simu

```js
const selectExpensiveList = state =>
  state.items.filter(i => i.active).sort(compareFn); // runs EVERY time, even if items didn't change
```

Selector inayounda safu/kitu kipya inarudi **kumbukumbu mpya** kila simu — ambayo inaweza kusambaza picha za aidinamiki zisizohitajika (React inaona thamani "mpya") na inaburutwa hesabu.

## Suluhisho: wajenzi wenye kumbukumbu (Reselect)

```js
import { createSelector } from "reselect"; // or RTK's createSelector

const selectActiveSorted = createSelector(
  [state => state.items],                       // input selector(s)
  (items) => items.filter(i => i.active).sort(compareFn) // recompute ONLY if items changed
);
```

`createSelector` inakamatia matokeo na tu inaeneza hesabu ghali wakati pembejeo yake (`state.items`) kweli inabadilika — vinginevyo inarudi **kumbukumbu sawa**, kuzuia hesabu tena na picha za chini na chini.

## Kuunda wajenzi

```js
const selectTotal = createSelector(
  [selectActiveSorted, selectTaxRate],          // build on other selectors
  (items, rate) => items.reduce((s, i) => s + i.price, 0) * (1 + rate)
);
```

Wajenzi huonekana, kujenga vitu vya kina kutoka vipande rahisi, vimehifadhiwa mmoja mmoja.

## Kwa nini ni muhimu

Wajenzi wanatenganisha sehemu kutoka muundo wa serikali (ushindi katika upasuaji) na kutoa mahali pamoja kuonyesha data inayotoka.

Memoization inakamatia wajenzi wenye asili kuwa mahusishi — kuepuka hesabu ghali kwa nasibu na, muhimu sana, kurudisha kumbukumbu dhabiti ili sehemu zilizounganishwa hazipikhwe aidinamiki zisizohitajika.

Katika Redux/NgRx programu, wajenzi wenye kumbukumbu (Reselect/`createSelector`) ni zana muhimu ya utendaji na usanifu; wazo sawa la kamatia hujitokeza kama `useMemo` na `computed` mahali pengine.