setInterval вызывает утечку памяти - PullRequest
0 голосов
/ 04 октября 2018

Мы явно сделали что-то не так в нашем коде, но мы не можем понять, что.Если мы хотим извлечь файл в течение определенного интервала, почему мы не можем использовать этот код?

<html>

<head>
    <script>
        let interval = 2

        function fetchSource(source) {
            fetch(source, { cache: 'no-cache' })
                .then(response => {
                    console.log('Memory-bloating')
                })
        }

        function test() {
            fetchSource('https://upload.wikimedia.org/wikipedia/commons/3/3d/LARGE_elevation.jpg')
        }

        setInterval(test, interval * 1000)
    </script>
</head>

<body>
    Memory-bloating in chrome
</body>

</html>

Проблема здесь в том, что каждый раз, когда мы выбираем, мы увеличиваем нашу память с размеромизображение, и никогда не кажется, что сбор мусора.Когда сайт работал в течение 2-3 часов, мы заполнили наш компьютер этим изображением.

Как мы должны построить эту функцию, чтобы не было такой большой утечки памяти?

Ответы [ 2 ]

0 голосов
/ 04 октября 2018

Публикация здесь, потому что код слишком длинный для комментария.Я думаю, что это, вероятно, ошибка Chrome, но, предотвращая одновременную загрузку, вы можете подтвердить это.

Следующее является более чистым эквивалентом кода @ McBern, который удаляет циклическую зависимость и необходимость поддерживать дополнительное состояние:

let interval = 2

function fetchSource(source) {
    return fetch(source, { cache: 'no-cache' })  // NB: return
          .then(response => {
               console.log('Memory-bloating')
           })
    }
}

(function test() {
   let url = 'https://upload.wikimedia.org/wikipedia/commons/3/3d/LARGE_elevation.jpg';

   fetchSource(url).then(() => setTimeout(test, interval * 1000));
})();
0 голосов
/ 04 октября 2018

Попробуйте этот код, это остановит:

   let interval = 2
   let handle = ""
   let still_fetching = false

       function fetchSource(source) {
           fetch(source, { cache: 'no-cache' })
               .then(response => {
                   console.log('Memory-bloating')
                   clearInterval(handle)
                   still_fetching = false
                   handle = null
                   handle = setInterval(test, interval * 1000)
               })
       }

       function test() {
           if(still_fetching){
               return;
           }
           still_fetching = true;
           fetchSource('https://upload.wikimedia.org/wikipedia/commons/3/3d/LARGE_elevation.jpg')
       }

       handle = setInterval(test, interval * 1000)
...