AngularJs memoryLeak when routing

Question

I have an AngularJs App with 3 screen, so the app is routing between those 3 screen every X seconds using ui-router component.

$stateProvider
    .state("page", {
        url: "/:pageId/:pageType",
        template: pageTemplate,
        controller: "contentCtrl",
        resolve: {
            contentSolver: function (resolveService, $stateParams) {
                resolveService.solveData($stateParams.pageId, $stateParams.pageType);
            }
        }
    })

And

  $state.go('page', {
                    pageId: $stateParams.pageId,
                    pageType: pageType
                });

I have a service called resolveService where i get the page content from server and then i pass the content to controller.

With every screen change, memory leak occurs (If i don't make the switch between pages there is no memory leak).

I found out this:

With every screen change, memory leak occurs (If i don't make the switch between pages there is no memory leak).

On every switch, I make a request to get some pictures but if I make the switch on the same page twice i get the same images 2 times, and so on..

Is there any way to delete the old ones?

Performance tab in Chrome Dev tools.

The number of nodes is increasing quickly, what I need o check on this case?

There is any tool that I can use to find the leak? I've tried Chrome extensions but no success with them, Dynatrace but they have support just for nodejs.

If you have any idea please let me know :), thanks!

I wouldn't consider this a "leak" per se. You should probably cache the result of the images call and resolve the images if the cache exists. — wimbletim
– wimbletim, Commented Jan 15, 2019 at 16:09

Vickey · Accepted Answer · 2019-01-15 16:15:18Z

1

you are routing your those pages with x seconds , you need to destroy the function which calls the transition which you are using (i.e transition onSuccess, onStart) destroy that once the transition is started, why because ,that will keeps on listening on each & every transition which results in the multiple occurrence of response.

$scope.$on('$destroy',functionName);

answered Jan 15, 2019 at 16:15

Vickey

3731 gold badge3 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Bogdan Over a year ago

i'm using a timeout to change it every X seconds, but before calling $state.go(..) I cancel it.

Collectives™ on Stack Overflow

AngularJs memoryLeak when routing

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related