Redux Toolkit: Data Normalization

Flatten complex data structures into ID-based dictionaries for instant O(1) lookups.

State Management7 min readConcept 14 of 22

What is Data Normalization?

In Redux, data normalization is the practice of structuring your state like a relational database. Instead of storing data in nested arrays, you flatten it into top-level dictionary objects (hash maps) keyed by unique IDs.

Redux Toolkit provides createEntityAdapter, a utility that automatically generates this standardized normalized state structure and provides pre-built reducer methods to manage it.

The O(n) Array Penalty

When data is stored in a standard array, updating a specific item requires an O(n) linear search. The reducer must map over the entire array until it finds the matching ID, and then it must allocate a brand new array in memory.

In a normalized dictionary, updating an item is an O(1) constant-time direct property lookup (e.g., state.entities[id]). This completely eliminates array iteration overhead.

The Generated State Structure

When you initialize a slice with adapter.getInitialState(), it creates an object with exactly two keys: an ids array and an entities dictionary.

The ids array maintains the display or sorting order, while the entities dictionary holds the actual data objects.

O(n) Array vs O(1) Dictionary

Compare the legacy array structure with the normalized structure generated by createEntityAdapter.

import { createEntityAdapter } from '@reduxjs/toolkit'; // 1. Generate Adapter const usersAdapter = createEntityAdapter(); // 2. Initial State { ids: [], entities: {} } const initialState = usersAdapter.getInitialState(); // 3. O(1) Dictionary Updates const usersSlice = createSlice({ name: 'users', initialState, reducers: { // Directly modifies entities[id] userUpdated: usersAdapter.updateOne, userAdded: usersAdapter.addOne, } });
O(n) Linear ArraySlow
const state = [
{ id: 101, name: 'Alice' }
🔎
{ id: 102, name: 'Bob' }
{ id: 103, name: 'Charlie' }
];
Requires mapping over the entire array to find and replace the updated item.
O(1) DictionaryFast
ids: [101, 102, 103]
entities: {
"101": { name: 'Alice' },
⚡
"102": { name: 'Bob' },
"103": { name: 'Charlie' }
}
Instant direct property access:
entities[102] = updatedUser;

createEntityAdapter standardizes O(1) hash map operations across your slices.

Check yourself

Pick an answer to lock it in, then read why. Getting one wrong is part of how it sticks.

  1. 1Why is a normalized dictionary faster for updates than an array?

Remember this

  • Normalize data to avoid storing duplicated information in deeply nested trees.
  • Updating items in an array takes O(n) time and creates new array references, triggering widespread re-renders.
  • createEntityAdapter automatically generates an { ids, entities } state structure.
  • Updating an entity in a dictionary takes O(1) time and isolates re-renders to just that specific item.

Done with this concept?

Mark it complete to track your progress. No login needed.