Redux Toolkit (RTK) क्लासिक Redux की तुलना में क्या प्रदान करता है?

Question

Accepted Answer

**Redux Toolkit (RTK)** आज Redux लिखने का आधिकारिक, अनुशंसित तरीका है। यह क्लासिक Redux की कुख्यात boilerplate को खत्म करता है — मैनुअल action types, action creators, immutable update logic, store setup — जबकि समान मूल सिद्धांतों को संरक्षित रखता है।

## RTK जो boilerplate समस्या हल करता है

```js
// ❌ classic Redux — verbose: action types, creators, switch reducers, manual immutability
const INCREMENT = "counter/increment";
const increment = () => ({ type: INCREMENT });
function reducer(state = { value: 0 }, action) {
  switch (action.type) {
    case INCREMENT: return { ...state, value: state.value + 1 };
    default: return state;
  }
}
```

## RTK: createSlice सब कुछ करता है

```js
import { createSlice, configureStore } from "@reduxjs/toolkit";

export const { increment, incrementBy } = counterSlice.actions; // action creators AUTO-generated
const store = configureStore({ reducer: { counter: counterSlice.reducer } });
```

`createSlice` स्वचालित रूप से action types और creators उत्पन्न करता है, और — **Immer** के माध्यम से — आपको "mutating" reducer code लिखने देता है जो सुरक्षित रूप से immutable updates में परिवर्तित हो जाता है। एक संक्षिप्त slice सभी मैनुअल टुकड़ों की जगह लेता है।

## RTK में अन्य क्या शामिल है

```text
configureStore   → store setup with DevTools + thunk middleware preconfigured
createAsyncThunk → standard async (pending/fulfilled/rejected actions) for data fetching
createEntityAdapter → normalized state + CRUD reducers for collections
RTK Query        → a full data-fetching/caching layer (like React Query, built into Redux)
```

## createAsyncThunk उदाहरण

```js
export const fetchUsers = createAsyncThunk("users/fetch", () => api.getUsers());
// auto-dispatches users/fetch/pending | fulfilled | rejected — handle in extraReducers
```

## RTK अब मानक क्यों है

```text
✓ ~75% less code than classic Redux
✓ Immer → no manual immutable spread logic (fewer bugs)
✓ Good defaults (DevTools, thunk) out of the box
✓ Encourages best practices (slices, normalized data)
✓ RTK Query bundles server-state management
```

## यह महत्वपूर्ण क्यों है

क्लासिक Redux की सबसे बड़ी आलोचना इसका boilerplate था; RTK सीधे इस समस्या को ठीक करता है, यही वजह है कि यह अब **आधिकारिक अनुशंसा** है और आधुनिक codebases में "Redux का उपयोग करना" का मतलब क्या है।

`createSlice` (Immer-powered, स्वचालित रूप से उत्पन्न actions), `createAsyncThunk` (async), `createEntityAdapter` (normalization), और RTK Query (server state) को समझना समकालीन Redux काम के लिए आवश्यक है — यह Redux की भविष्यवाणीता को संरक्षित करता है जबकि उस औपचारिकता को हटाता है जिसने कई टीमों को विकल्पों की ओर ले जाया।