I am currently investigating a memory leak related to the nodes count, but I am finding it difficult to understand Angular's behavior. The results are inconsistent and do not provide a clear explanation of what is happening.
I have developed a simple application with 1 controller and 2 views. Both views utilize the same controller:
core.controller('CoreCtrl', [function() {
var core = this;
core.helloWorld = function() {
console.log('hello world');
};
}]);
core.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/test1', {
template: '<a href="#/test2" ng-click="core.helloWorld()">Go to test 2</a>',
controller: 'CoreCtrl',
controllerAs: 'core'
})
.when('/test2', {
template: '<a href="#/test1" ng-click="core.helloWorld()">Go to test 1</a>',
controller: 'CoreCtrl',
controllerAs: 'core'
})
.otherwise({redirectTo: '/test1'});
}]);
I conducted a timeline recording in Chrome dev tools by rapidly switching between views and then alternating every other second, as indicated in the graph.
Here are the results:
https://i.sstatic.net/CYJsf.png
After the initial quick view switching, there is a significant drop in nodes count. Subsequently, when switching views at a slower pace followed by quicker switches, the decrease in nodes count is not as pronounced as before, and the count continues to rise afterward.
There are two key points that concern me:
Why does the nodes and listeners count increase after switching views before dropping again? Shouldn't this pattern resemble more of a sawtooth shape,
- _ - _ - _ - _-, given that each view switch should clean up nodes and listeners?Why is the second drop in node count not as drastic as the first one?
It seems like there may be an issue with cleaning up resources efficiently during view switches. Or perhaps something is not being cleaned up correctly, despite no manual cleanup required for listeners.
Can anyone provide insight into these test results?