JavaScript听众不断增加

Question

我实现了一个 Web 应用程序并使用 google 开发人员工具监控性能。我注意到听众不断增加，堆也是如此。

听众增加的部分是这样的

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)

  }])

看表演的结果和上图一样。您应该使用一个简单的网络服务器来发出 GET 请求。

Answer 1

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

我建议，如果上一个没有完成，请不要做请求：

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

Answer 2

根据this issue, more specifically this comment，这是由于Chrome在录制性能时间线期间没有垃圾收集监听器造成的。

JavaScript听众不断增加

JavaScript listeners keep increasing

javascript

google-chrome

listeners

angularjs