Apakah itu normalisasi keadaan?

Question

Accepted Answer

**Normalisasi** bermakna menyimpan data dalam struktur datar dan relasional — dikunci dengan **id** dalam jadual pencarian — bukan objek/tatasusunan yang tersarang dalam. Ia adalah idea yang sama seperti normalisasi pangkalan data, digunakan untuk keadaan klien, dan ia membuat kemas kini dan pencarian cekap dan konsisten.

## Masalah dengan keadaan tersarang/denormalisasi

```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
```

Data tersarang yang diduplikasi mesti dikemas kini di banyak tempat (risiko ketidakkonsistenan), dan mencari item bermakna mengimbas tatasusunan (O(n)).

## Bentuk yang dinormalisasi

```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
  },
}
```

Setiap entiti disimpan sekali, dikunci dengan id; hubungan hanyalah rujukan id.

## Faedah

```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
```

## Alatan

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

## Mengapa ia penting

Normalisasi ialah pola piawai untuk menguruskan data **relasional/koleksi** dalam keadaan klien (terutamanya dalam Redux).

Ia menguatkuasakan sumber-kebenaran-tunggal bagi setiap entiti (kemas kini sekali, mencerminkan di mana-mana), memberikan pencarian berasaskan id yang cepat, dan mengelakkan pepijat dan isu prestasi data tersarang dan diduplikasi.

Untuk aplikasi yang mempunyai senarai entiti yang berkaitan (pengguna, siaran, ulasan) yang dikemas kini dan dirujuk silang, menormalisasi kedai — selalunya melalui `createEntityAdapter` — ialah teknik utama untuk mengekalkan keadaan konsisten dan cekap.