JavaScript监听器不断增加

时间:2017-10-11 19:12:38

标签: javascript angularjs google-chrome listeners

我实施了一个网络应用程序,并使用谷歌开发人员工具监控了性能。我注意到监听器不断增加,堆也是如此。

enter image description here

听众增加的部分看起来像这样

let ival = $interval(function () {
    $http.get('someurl') // this call is actually done through a service, don't know if that matters
}, 1000)

我会理解堆是否因垃圾收集器收集的某些数据而增长但我不明白为什么听众会增加?

这是一个可重复的,最小的例子:

index.html文件:

<!doctype html>
<html ng-app="exampleModule">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>
    <script src="script.js"></script>
  </head>
  <body>
    <div ng-controller="someController">
    </div>
  </body>
</html>

script.js文件:

angular.module("exampleModule", [])
  .controller("someController", [ "$http", "$interval", function ($http, $interval) {

    $interval(function () {
      $http.get('script.js')
    }, 1000)

  }])

观看演出时的结果与上图相同。您应该使用简单的Web服务器来发出GET请求。

2 个答案:

答案 0 :(得分:8)

根据this issue,更具体地说this comment,这是由Chrome在录制演奏时间线期间而非垃圾收集侦听器引起的。

答案 1 :(得分:0)

您的获取请求可能持续超过1秒。但是你每1秒调用一次。所以一个请求在另一个请求完成之前就开始了,它们堆积起来,最终变慢。

我建议,如果前一个请求没有完成,请不要提出请求:

let previousOneOngoing = false;
let ival = $interval(function () {
    if(previousOneOngoing) return;
    previousOneOngoing = true;
    $http.get('someurl')
        .then(function() { previousOneOngoing = false; })
}, 1000)