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

@lightheaded lightheaded commented Feb 1, 2018

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

@jotatoledo jotatoledo commented Feb 6, 2018

Are you setting a limit to the state history?

@lightheaded
Copy link
Author

@lightheaded lightheaded commented Feb 6, 2018

@zalmoxisus
Copy link
Owner

@zalmoxisus zalmoxisus commented Feb 9, 2018

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

@phil-lgr phil-lgr commented Jul 12, 2018

image

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

@phil-lgr
Copy link

@phil-lgr phil-lgr commented Jul 12, 2018

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

@phil-lgr
Copy link

@phil-lgr phil-lgr commented Jul 12, 2018

I guess I need to sanitize... ? mmmm

image

@phil-lgr
Copy link

@phil-lgr 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

@zalmoxisus zalmoxisus commented Nov 18, 2018

Thanks for the example! Added it to Troubleshooting.

@zalmoxisus zalmoxisus closed this Nov 18, 2018
@phil-lgr
Copy link

@phil-lgr phil-lgr commented Nov 18, 2018

@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

@phil-lgr phil-lgr commented Nov 18, 2018

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

@zalmoxisus
Copy link
Owner

@zalmoxisus zalmoxisus commented Nov 18, 2018

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 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

@zalmoxisus zalmoxisus commented Nov 18, 2018

Thanks again!

zalmoxisus added a commit that referenced this issue Nov 18, 2018
zalmoxisus added a commit that referenced this issue Nov 18, 2018
Related to #455, #476, #558, #543, #566.
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>
@msorens msorens mentioned this issue Dec 17, 2020
3 of 4 tasks complete
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
4 participants