"Sometimes, you have to let go of a good thing to get a better one."

State Management is one of the most important parts of any app. It helps improve the app's performance greatly. One of the most widely used solutions for React Native is Redux. Although it is very popular technique but still has some limitations.

The Problem Statement

Redux is great but does have a few limitations:

1. Configuring a Redux store is too complicated and requires a lot of initial setup.2. You need to add a lot of packages to get Redux to do even basic stuff.3. Redux requires too much boilerplate code.

Keeping these limitations in mind, our Kristal Mobile Team took a deep dive into the vast internet to look for a better solution. On our adventurous journey spanning a number of possible solutions, we finally stumbled upon a solution that worked — Redux Toolkit.

The Solution

Here are some of the benefits of Redux Toolkit over Redux :

It saves us from a ton of boiler-plate code as it comes with pre configured methods and APIs.
It helps in faster development since less code needs to be written.
It provides all the functionalities of Redux minus the above limitations.

The Implementation

Below are the steps for adding Redux Toolkit to project :

For adding redux toolkit to the project we simply need to add two libraries @reduxjs/toolkit and react-redux.
The library includes all the necessary APIs for state management like :- configureStore : provides options for redux store configuration and includes redux thunk middleware by default.- createSlice : simple api which gives ability to create a Redux Store and provides options for adding initial state, reducers, extra reducers and name.
It also provides actions and reducers as it internally uses createAction and createReducer api provided by redux toolkit.- Reducers: they are used for actions created for that particular slice.- Extra reducers: they are used for action which are defined somewhere else for example Async Actions.- createAsyncThunk: and pi which is used for processing asynchronous tasks and generating actions.- It returns an object containing name, reducers and actions, the actions can be used for dispatching which can be defined at any event or actions by the user.

Conclusion

While Redux is good, Redux Toolkit provides many functionalities out-of-the-box and avoids most of the boring boilerplate code. It makes the code lean, clean and simple to manage, and that's why the Kristal team prefers Redux Toolkit.

Deep Gandhi

September 21, 2021

Liked it?
Share it with your friends & colleagues!

Tech@Kristal

March 3, 2021

Why React Native and not Flutter ?

Dhruv Jindal

Tech@Kristal

May 28, 2021

How to keep your react-native app size under check

Kshitij Gangal

Tech@Kristal

July 7, 2021

How Kristal.AI built the iOS app CI/CD pipeline and saved up to 2 hours of developers’ time daily

Dhruv Jindal

Go to Blog

Ready to start investing?

A fully digital onboarding process that can be completed within 15 minutes.
No more voluminous paperwork and queuing!

Investment Solutions

Invest with us

Company

Resources

+65 92391022

Partnerships

cp@kristal.ai

Customer Support

support@kristal.ai

We are licensed in Singapore, Hong Kong and India. Kristal Advisors (SG) Pte. Ltd. presently operates under the CMS license by the Monetary Authority of Singapore (MAS). Kristal Advisors (HK) Ltd is licensed and regulated by the Securities and Futures Commission (SFC) to carry out Type 4 and Type 9 regulated activities and is not involved in the discretionary management of any collective investment scheme. Kristal Advisors Private Ltd. presently operates as a Registered Investment Advisor under the jurisdiction of the Securities and Exchange Board of India (SEBI).

Read more about our privacy policy - Here

Copyright © 2023 Kristal Advisors (SG) Pte. Ltd. UEN: 201711235E

Investors

Institutional Clients

Partner with us

Wealth-tech Platform

Kristal PaaS