Kakšna je razlika med lokalnim in globalnim stanjem?

Question

Accepted Answer

**Lokalno stanje** pripada enemu komponentu (ali majhnemu podsestvu) in ni potrebno drugje. **Globalno stanje** je skupnoMany komponentam, pogosto oddaljenim, po vsej aplikaciji.

## Lokalno stanje — omejeno na en komponento

```jsx
function SearchBox() {
  const [query, setQuery] = useState(""); // only THIS component needs `query`
  return <input value={query} onChange={e => setQuery(e.target.value)} />;
}
```

Lokalno stanje živí znotraj komponente (`useState`, `ref`, `data()`). Primeri: vrednosti vnosov, ali je spustni meni odprt, stanje prehoda, osnutek obrazca. Noben drug komponento si ne misli na to.

## Globalno stanje — skupno v celotni aplikaciji

```jsx
// the logged-in user is needed by the navbar, profile page, settings, checkout...
const user = useUserStore(s => s.user); // from a global store/context
```

Globalno stanje je podatek, ki ga mora prebrati ali posodobiti mnogo nepovezanih komponent dosledko: avtenticirani uporabnik, tema, nakupovalni voziček, obvestila v aplikaciji. Živi v Contextu, shrambě (Redux/Zustand/Pinia) ali podobno.

## Kako se odločiti

```text
Ask: "How many components need this, and how far apart are they?"

One component (or parent+child)         → LOCAL state
Many unrelated components / whole app    → GLOBAL state
```

## Pogosta napaka: prekomerno globaliziranje

```jsx
// ❌ putting a single form's input in global state — unnecessary complexity
globalStore.setFormInput(value);

// ✅ keep it local — only this form uses it
const [value, setValue] = useState("");
```

Za vse globalno povzroča več kode, povezuje komponente in lahko poslabša zmogljivost (več wieder-renderiranj). Najboljša praksa je **ohraniti stanje čim bolj lokalno**, in ga dvigniti na globalno le, ko delitev res zahteva.

## Zakaj je to pomembno

Izbira med lokalnim in globalnim je ena najbolj posledičnih odločitev o stanju.

Ohranjevanje stanja lokalnega ohranja komponente preproste, samostojne in zmogljive; seganje po globalnem stanju le, ko so podatki res skupni, se izogiba nepotrebni kompleksnosti.

Pogost anti-vzorec — dajanje vsega v globalno shrambo »za vsak primer« — vodi do napihnjenega, tesno povezanega aplikacije.

Vodilno pravilo: **lokaliziraj po privzetku, globaliziraj le, ko to deljenje zahteva.**