"ఒకే నిజం యొక్క మూలం" అంటే ఏమిటి?

Question

Accepted Answer

**ఒకే నిజం యొక్క మూలం** అంటే ప్రతిটి డేటా భాగం **సరిగ్గా ఒక స్థానంలో** నిల్వ చేయబడుతుంది, మరియు దానిని కావలసిన ప్రతిదీ అక్కడ నుండి చదువుతుంది — బహుళ కాపీలను ఉంచకుండా అవి వేరుగా వెళ్లవచ్చు.

## ఇది నిరోధించే సమస్య: నకిలు, భిన్నమైన స్థితి

```jsx
// ❌ the same data stored in two places → they can disagree
function Profile() {
  const [user, setUser] = useState({ name: "Ann" });
  const [displayName, setDisplayName] = useState("Ann"); // a COPY of user.name

function rename(newName) {
    setUser({ ...user, name: newName }); // updated user...
    // ...but forgot to update displayName → now they're out of sync! 🐛
  }
}
```

ఒకే వాస్తవం రెండు స్థితులలో ఉన్నప్పుడు, ప్రతిটి అపడేట్ రెండింటినీ మార్చడం గుర్తుంచుకోవాలి — మరియు తప్పకుండా ఒకటి కోల్పోతారు, UI సంబంధం లేని విలువలను చూపించేలా బగ్‌లను ఉత్పత్తి చేస్తారు.

## ఫిక్స్: ఒక మూలం, మిగిలినవి తీసుకోండి

```jsx
// ✅ user.name is the single source; displayName is DERIVED, not stored
function Profile() {
  const [user, setUser] = useState({ name: "Ann" });
  const displayName = user.name.toUpperCase(); // computed on render — always in sync

function rename(newName) {
    setUser({ ...user, name: newName }); // one update, everything stays consistent
  }
}
```

కానోనికల్ విలువను ఒక్కసారి నిల్వ చేయండి; అది నుండి ఉత్పన్నమైన ఏదైనా ఫ్లై వద్ద గణించండి. సమకాలీకరించడానికి ఏమీ లేదు.

## ఈ సూత్రం ఎక్కడ వర్తిస్తుంది

```text
✓ Don't copy props into state (the prop is the source)
✓ Don't store derived values (compute them: totals, filtered lists, formatted text)
✓ Global stores (Redux/Pinia): one store is the source for shared data
✓ Server data: cache it once (React Query) rather than copying into many components
✓ URL as source: filters/page in the URL, read from there
```

## ఇది ఎందుకు ముఖ్యమైనది

ఒకే నిజం యొక్క మూలం నమ్మదగిన స్థితి నిర్వహణ యొక్క ఆధారమైన సూత్రం — ఇది నకిలు డేటా వేరుగా చేయడం వల్ల కలిగే బగ్‌ల యొక్క పూర్తి తరగతిని తొలగిస్తుంది.

ఇది *ఎందుకు* మీరు విలువలను నిల్వ చేయకుండా ఉత్పన్నం చేస్తారు, *ఎందుకు* మీరు స్థితిలో props కాపీ చేయడాన్ని నివారిస్తారు, మరియు *ఎందుకు* ప్రపంచ వ్యాపార దుకాణాలు ఉమ్మడి డేటాను కేంద్రీకరిస్తాయి.

డేటా ఒక అధికారపూర్వక ఇల్లను కలిగి ఉంటే మరియు ప్రతిదీ అక్కడ నుండి చదువుతుంటే, మీ UI నిర్మాణం ద్వారా సమానంగా ఉంటుంది.