react-redux - ローカル状態を保存するreact-boilerplate

Question

https://github.com/react-boilerplate/react-boilerplate v3.4.0 を使用して、ユーザーが更新ボタンをクリックしたときに状態の要素を保持したいと考えています。
私がやったこと：app.jsで変更しました const initialState = {}; const store = configureStore(initialState, browserHistory);

に：

const initialState = loadState();
const store = configureStore(initialState, browserHistory);

ここで、state.global を永続化するために persist.js が使用されます。

export const loadState = () => {
  try {
     const serializedState = localStorage.getItem('state');
     if (serializedState === null) {
       return undefined;
     }
     return JSON.parse(serializedState);
  } catch (err) {
    return undefined;
  }
};

export const saveState = (state) => {
  try {
     const serializedState = JSON.stringify({ global: state.get('global').toJS()});
     localStorage.setItem('state', serializedState);
  } catch (err) {
     console.log(err);
  }
};

store が返される前のデフォルトの store.js に次を追加しました：

  store.subscribe(() => {
    saveState(store.getState());
  });

明らかに、これは後で調整することで改善できます。

したがって、状態がローカルストレージに正しく保持され、ローカルストレージから正しくリロードされていることを認証した後、何が起こっているのですか。

認証後にページを更新すると、store.js のトレースが開始されました。

createStore が実行される前の初期状態は次のとおりです。

実行後:

  const store = createStore(
    createReducer(),
    fromJS(initialState),
    composeEnhancers(...enhancers)
 );

store.getState() は以下を返します。

そのため、リデューサーの初期状態から値を取得しています。reduxのドキュメントに次のように記載されているため、これがなぜ起こっているのかわかりません。

オプションで、createStore() の 2 番目の引数として初期状態を指定できます。これは、サーバー上で実行されている Redux アプリケーションの状態と一致するようにクライアントの状態をハイドレートするのに役立ちます。

私の質問は、画面の更新後に状態を保持するにはどうすればよいですか?また、初期状態がリデューサーによって上書きされるのはなぜですか?