Redux-persist: PersistGate causing slowness

Created on 2 May 2018 · 10Comments · Source: rt2zz/redux-persist

In development environment, I noticed that with each reload that the app was slow. So I did some testing, and by removing PersistGate, the app loads easily, and without any slowness.

cfgStore:

import { createStore, applyMiddleware } from 'redux';
import thunk from 'redux-thunk';
import { persistStore, persistReducer } from 'redux-persist';
import storage from 'redux-persist/lib/storage';

import reducers from './combineStore';

const persistConfig = {
    key: 'root',
    storage,
};

const cfgStore = () => {
    const middlewares = [thunk];
    const enhancer = applyMiddleware(...middlewares);
    const persistedReducer = persistReducer(persistConfig, reducers);

    // create store
    return createStore(persistedReducer, enhancer);
};

export const persistor = persistStore(cfgStore());

export default cfgStore;

index.js

// ...

export default class App extends Component {
    componentDidMount(){
        SplashScreen.hide()
    }

    render() {
    // ...
        return (
            <Provider store={store}>
                <PersistGate loading={null} persistor={persistor}>
                    <StatusBar
                        backgroundColor={mainStyle.principalBackColor}
                        barStyle="dark-content"
                    />
                    <Loader loading={loader}/>
                    <RouterWithRedux>
                        <Scene key='root'>
                            <Scene
                                component={List}
                                // initial={isLoggedIn && token}
                                initial={true}
                                hideNavBar={true}
                                key='List'
                                title='List'
                            />
                        </Scene>
                    </RouterWithRedux>
                </PersistGate>
            </Provider>
        )
    }
}

My stack:
react-native 0.54.4
react-native-router-flux ^4.0.0-beta.28
react-redux ^5.0.7
redux-persist ^5.9.1
redux-thunk ^2.2.0

Source

adhenrique

Most helpful comment

@adhenrique how did you resolved this issue?

oleole90 on 3 Jun 2018

👍21

All 10 comments

I faced the same issue

workostap on 10 May 2018

@adhenrique how did you resolved this issue?

oleole90 on 3 Jun 2018

👍21

Having the same problem. Could anyone pinpoint to a solution?

waclock on 4 Feb 2019

Any hint here ?

el-lsan on 11 Apr 2019

why this one is closed? facing same issue

chaiyilin on 13 May 2019

Having the same problem. Any solutions?

sreehari95 on 3 Jul 2019

It's been 1 year since I posted this problem here. I will try to run it again, and I will comment again here.

if I'm not mistaken, it was something related to configuration ...

adhenrique on 3 Jul 2019

👍7

@adhenrique did you find something?
I created this feature request, I don't know if it's possible, but I'll surely look it this weekend.
https://github.com/rt2zz/redux-persist/issues/1094