I implemented a web application and monitored the performance with the google developer tools. I notice that the listeners keep increasing and so is the heap.
The part where the listeners are increasing looks something like this
let ival = $interval(function () {
$http.get('someurl') // this call is actually done through a service, don't know if that matters
}, 1000)
I would understand if the heap grows because of some data not beeing collected by the garbage collector but I don't understand why the listeners are increasing?
Here is a reproducable, minimal example:
The index.html file:
<!doctype html>
<html ng-app="exampleModule">
<head>
<script src=".6.6/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<div ng-controller="someController">
</div>
</body>
</html>
And the script.js file:
angular.module("exampleModule", [])
.controller("someController", [ "$http", "$interval", function ($http, $interval) {
$interval(function () {
$http.get('script.js')
}, 1000)
}])
The results when you watch the performance are the same as in the picture above. You should use a simple webserver in order to make the GET request.
I implemented a web application and monitored the performance with the google developer tools. I notice that the listeners keep increasing and so is the heap.
The part where the listeners are increasing looks something like this
let ival = $interval(function () {
$http.get('someurl') // this call is actually done through a service, don't know if that matters
}, 1000)
I would understand if the heap grows because of some data not beeing collected by the garbage collector but I don't understand why the listeners are increasing?
Here is a reproducable, minimal example:
The index.html file:
<!doctype html>
<html ng-app="exampleModule">
<head>
<script src="https://ajax.googleapis./ajax/libs/angularjs/1.6.6/angular.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<div ng-controller="someController">
</div>
</body>
</html>
And the script.js file:
angular.module("exampleModule", [])
.controller("someController", [ "$http", "$interval", function ($http, $interval) {
$interval(function () {
$http.get('script.js')
}, 1000)
}])
The results when you watch the performance are the same as in the picture above. You should use a simple webserver in order to make the GET request.
Share edited Oct 17, 2017 at 22:38 CDspace 2,68919 gold badges32 silver badges39 bronze badges asked Oct 11, 2017 at 19:12 StefanStefan 7491 gold badge11 silver badges25 bronze badges 3-
Do you call
$interval.cancel(ival);somewhere, or stop that interval somehow else? Or is a new interval created over and over again, without stopping the old one? – t.niese Commented Oct 11, 2017 at 19:32 - $interval.cancel(ival) will be called once the activity will be destroyed. The interval is beeing created when the activity is created. – Stefan Commented Oct 11, 2017 at 19:47
- Does it work similarly for you when the app consists only of a snippet you've shown? If it doesn't, you need to provide stackoverflow./help/mcve that replicates your problem. It can be virtually everything. – Estus Flask Commented Oct 11, 2017 at 20:35
2 Answers
Reset to default 16 +50According to this issue, more specifically this ment, it's caused by Chrome not garbage collecting listeners during recording of the performance timeline.
Your get request probably lasts more than 1 second. But you call it every 1 second. So one request starts before other one finishes, and they pile up, eventually getting slower.
I suggest, don't do a request if the previous one isn't finished:
let previousOneOngoing = false;
let ival = $interval(function () {
if(previousOneOngoing) return;
previousOneOngoing = true;
$http.get('someurl')
.then(function() { previousOneOngoing = false; })
}, 1000)
发布者：admin，转转请注明出处：http://www.yc00.com/questions/1743667738a4487260.html
评论列表（0条）