Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Excessive use of memory and CPU #455

Closed
lightheaded opened this issue Feb 1, 2018 · 13 comments
Closed

Excessive use of memory and CPU #455

lightheaded opened this issue Feb 1, 2018 · 13 comments

Comments

@lightheaded
Copy link

MacOS High Sierra 10.13.2 (17C205)
Chrome Version 63.0.3239.132 (Official Build) (64-bit)
Redux Devtools 2.15.1

Every time I inspect any Redux application, it uses up a considerable chunk of CPU and starts leaking memory.

screen shot 2018-02-01 at 14 07 01

I realise this is not enough information for debugging, but I would appreciate any thoughts on where to look for finding the leak?.

@jotatoledo
Copy link

Are you setting a limit to the state history?

@lightheaded
Copy link
Author

lightheaded commented Feb 6, 2018 via email

@zalmoxisus
Copy link
Owner

That is happening due to serialization of some huge objects included in the state or action. The solution is to sanitize them.

@phil-lgr
Copy link

image

I did some profiling and the extension takes 1-2s seconds to finish rendering

@phil-lgr
Copy link

This was with v2.15.2 from the Chrome store.. i'll keep digging see what's going on

@phil-lgr
Copy link

I guess I need to sanitize... ? mmmm

image

@phil-lgr
Copy link

phil-lgr commented Jul 12, 2018

thanks @zalmoxisus, ui-router puts some big objects in the reducer, just took what I needed

const actionSanitizer = action => {
    const uiRouterActions = /@ui-router.+/g;
    return uiRouterActions.test(action.type)
        ? { type: action.type, transition: sanitizeUIRouterTransition(action.transition) }
        : action;
};
const stateSanitizer = (state: AppState): any => {
    if (state.router && state.router.last && state.router.last) {
        return {
            ...state,
            router: sanitizeUIRouterTransition(state.router.last)
        };
    }
    return state;
};
const sanitizeUIRouterTransition = (transition: Transition): any => ({
    params: transition.router && transition.router.globals && transition.router.globals.params,
    current: transition.router && transition.router.globals && transition.router.globals.current,
    targetState: transition.targetState && transition.targetState().state(),
    from: transition.from && transition.from(),
    to: transition.to && transition.to()
});
const reduxDevtoolsExtensionOptions = {
    actionSanitizer,
    stateSanitizer
};
const composeEnhancers =
    (window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ &&
        window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__(reduxDevtoolsExtensionOptions)) ||
    compose;

@zalmoxisus
Copy link
Owner

Thanks for the example! Added it to Troubleshooting.

@phil-lgr
Copy link

@zalmoxisus do you have a patreon or open collective for redux dev tool, I wish I had time to contribute but I don't, I would happily $ to encourage you, this extension is so important in the redux ecosystem

@phil-lgr
Copy link

OH, I just saw you have an open collective! I will contribute thanks!

@zalmoxisus
Copy link
Owner

Thanks @phil-lgr! That example is also a contribution. Other contributions are also much appreciated, I'll use them to alloc more time in finishing https://github.com/zalmoxisus/redux-devtools-extension/projects

@phil-lgr
Copy link

phil-lgr commented Nov 18, 2018

Done, added my monthly contribution, BTW, I would put the open collective link higher in the README.md, it's long so I didn't noticed it, IMO no need to be shy for some $, put it right on top bro! 🥇

@zalmoxisus
Copy link
Owner

Thanks again!

zalmoxisus added a commit that referenced this issue Nov 18, 2018
zalmoxisus added a commit that referenced this issue Nov 18, 2018
msorens added a commit to chef/automate that referenced this issue May 11, 2020
Before crashing it at least complains it is going to be slow
and consume a huge amount of memory.
That is described here:
https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/Troubleshooting.md#excessive-use-of-memory-and-cpu

In there is a link to a more useful example:
zalmoxisus/redux-devtools-extension#455

Latest conversation seems to be here:
zalmoxisus/redux-devtools-extension#619

Signed-off-by: michael sorens <msorens@chef.io>
msorens added a commit to chef/automate that referenced this issue Oct 15, 2020
Before crashing it at least complains it is going to be slow
and consume a huge amount of memory.
That is described here:
https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/Troubleshooting.md#excessive-use-of-memory-and-cpu

In there is a link to a more useful example:
zalmoxisus/redux-devtools-extension#455

Latest conversation seems to be here:
zalmoxisus/redux-devtools-extension#619

Signed-off-by: michael sorens <msorens@chef.io>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants