Was ist State Normalization?

Question

IT Interview Practice · Accepted Answer

**Normalization** bedeutet, Daten in einer flachen, relationalen Struktur zu speichern — indiziert nach **id** in Nachschlagetabellen — anstatt in tief verschachtelten Objekten/Arrays. Es ist dieselbe Idee wie Datenbanknormalisierung, angewendet auf Client-State, und es macht Updates und Lookups effizient und konsistent.

## Das Problem mit verschachteltem/denormalisiertem State

```js
// ❌ nested & duplicated — the same user appears in multiple posts
posts: [
  { id: 1, title: "A", author: { id: 10, name: "Ann" } },
  { id: 2, title: "B", author: { id: 10, name: "Ann" } }, // Ann duplicated
]
// To rename Ann, you must find and update EVERY copy → easy to miss one (drift)
// To find post #2, you must scan the array
```

Duplizierte verschachtelte Daten müssen an vielen Stellen aktualisiert werden (Inkonsistenzrisiko), und das Finden eines Elements bedeutet Array-Scans (O(n)).

## Die normalisierte Form

```js
// ✅ flat lookup tables keyed by id, with references by id
{
  posts: {
    byId: { 1: { id: 1, title: "A", authorId: 10 },   // reference the author by id
            2: { id: 2, title: "B", authorId: 10 } },
    allIds: [1, 2],                                     // order/iteration
  },
  users: {
    byId: { 10: { id: 10, name: "Ann" } },             // each user stored ONCE
  },
}
```

Jede Entity wird einmal gespeichert, indiziert nach id; Beziehungen sind nur id-Referenzen.

## Die Vorteile

```js
state.users.byId[10];                        // ✅ O(1) lookup by id
state.users.byId[10] = { ...u, name: "Bob" }; // ✅ update Ann ONCE → reflected everywhere
state.posts.allIds.map(id => state.posts.byId[id]); // iterate via the id list
```

```text
✓ Single source of truth per entity → no duplication, no drift
✓ O(1) lookups/updates by id (vs scanning arrays)
✓ Easy to update one entity and have all references reflect it
✓ Simpler to manage relationships and merge new data
```

## Werkzeuge

```text
Redux Toolkit's createEntityAdapter generates normalized { ids, entities }
structures + CRUD reducers automatically. normalizr can normalize API responses.
```

## Warum es wichtig ist

Normalization ist das Standard-Pattern zur Verwaltung von **relationalen/Collection-Daten** in Client-State (besonders in Redux).

Es erzwingt eine Single-Source-of-Truth pro Entity (einmal aktualisieren, überall reflektiert), bietet schnelle id-basierte Lookups und vermeidet die Bugs und Performance-Probleme von tief verschachtelten, duplizierten Daten.

Für Apps mit Listen von verwandten Entities (Benutzer, Posts, Kommentare), die aktualisiert und kreuzverweis werden, ist die Normalisierung des Stores — häufig über `createEntityAdapter` — eine Schlüsseltechnik, um State konsistent und effizient zu halten.

Das Problem mit verschachteltem/denormalisiertem State

Die normalisierte Form

Die Vorteile

Werkzeuge

Warum es wichtig ist

Ähnliche Fragen