JavaScript内存泄漏使用setInterval

时间:2014-01-18 22:47:22

标签: javascript ajax memory memory-leaks

我的javascript应用程序泄漏内存时遇到问题。我在线查找了一些东西,我似乎已经通过使用

关闭了setInterval循环中的任何内存分配
variableX = null

技术。但是应用程序仍在以某种方式泄漏内存,任何人都可以指出可能导致此泄漏的原因吗?这是我的代码:

<!DOCTYPE html>
<html>
<head>
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
  <meta charset="utf-8">
  <title>Simple markers</title>
  <style>
     html, body, #map-canvas {
     height: 100%;
     margin: 0px;
     padding: 0px
     }
  </style>
  <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
  <script>

     function initialize() {
         var myLatlng = new google.maps.LatLng(43.46949, -80.54661);
         var lat = 0;
         var long = 0;
         var mapOptions = {
             zoom: 16,
             center: myLatlng,
             mapTypeId: google.maps.MapTypeId.ROADMAP
         }

         function loadXMLDoc() {
             var xhr;
             if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
                 xhr = new XMLHttpRequest();
             } else { // code for IE6, IE5
                 xhr = new ActiveXObject("Microsoft.XMLHTTP");
             }
             xhr.open("GET", "coordinates.txt", true);
             xhr.onreadystatechange = function () {
                 if (this.readyState == 4) {
                     var textfileString = this.responseText;
                     var longLatString = textfileString.split(',');
                     lat = parseFloat(longLatString[0])
                     long = parseFloat(longLatString[1])
                     textfileString = null
                     longLatString = null
                 }
             }
             xhr.send();
             xhr = null
         }
         var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
         var marker = new google.maps.Marker({
             position: myLatlng,
             map: map,
             title: 'Hello World!'
         });
         setInterval(function () {
             loadXMLDoc()
             var newLatLng = new google.maps.LatLng(lat, long);
             marker.setPosition(newLatLng);
             newLatLng = null
         }, 16);
     }
     google.maps.event.addDomListener(window, 'load', initialize);

  </script>
</head>
<body>
  <div id="map-canvas"></div>
</body>
</html>

1 个答案:

答案 0 :(得分:3)

您正在发送新的XMLHttpRequest,而无需等待旧的function getCoordinates() { ... xhr.onreadystatechange = function() { ... setTimeout(getCoordinates, 30000); } } 完成。如果响应时间超过16毫秒(可能会响应),“请求队列”将增加,导致内存泄漏。

发送请求不间断是一个坏主意。如果您需要一个恒定的坐标流,请将多个坐标打包到一个响应中,并仅在前一个请求完成时发送新请求:

{{1}}

更好的是,使用Websockets。