Выполнение повторяющихся запросов javascript fetch быстро заполняет память браузера. Есть ли способ предотвратить это? - PullRequest
Новая
       42

Выполнение повторяющихся запросов javascript fetch быстро заполняет память браузера. Есть ли способ предотвратить это?

0 голосов
/ 09 июля 2020

Я создаю веб-страницу, которая отображает прямой поток событий, содержащих изображения. Для этого я решил попробовать использовать работающую клиентскую часть javascript с приведенным ниже кодом, чтобы получать данные из моей конечной точки API каждые 1 секунду (а затем обновлять html соответственно). Я заметил, что результат каждого запроса на выборку сохраняется в памяти, и это быстро заполняет память браузера, особенно если запускается в течение нескольких часов или всего дня, как планировалось.

Я искал inte rnet и обнаружил, что могу установить созданные объекты как null, чтобы пометить их как безопасные для очистки для сборщика мусора, но я новичок в javascript, и я не уверен, где / что на самом деле установить равным null . Знаете ли вы, что я должен установить значение null в приведенном ниже коде?

Если есть какое-либо другое решение, мы будем очень благодарны за руководство.

Код: EDIT: удален setTimeout (1) - все еще получить такое же поведение, как описано выше. 

let myHeaders = new Headers();
myHeaders.append("xxxx", "xxxxxx");
myHeaders.append("Content-Type", "text/plain");

let raw = "{x:x}";

let requestOptions = {
  method: 'POST',
  headers: myHeaders,
  body: raw,
  redirect: 'follow'
};

function printResult(result){
    console.log(result);
}

function getLatestRecords(){
    fetch("https://xxxx.xxxx.com", requestOptions)
      .then(response => response.json())
      .then(result => printResult(result))
      .catch(error => console.log('error', error));

    //setTimeout(1)
}

let interval = setInterval(
    function() {
        getLatestRecords()
    },
    1000
);

Похоже, объекты данных создаются для каждой выборки:

извлекать созданные объекты

1 Ответ

1 голос
/ 09 июля 2020

Не ясно, связано ли это с вашей утечкой памяти, но вы используете setTimeout странным образом. setTimeout предназначен для планирования обратного вызова, который будет вызываться через определенное количество миллисекунд; setTimeout(1) - неопределенное поведение.

Поскольку вы намерены отменить запрос на выборку через 1 секунду, вы захотите сделать это вместо этого: 

function getLatestRecords(){
    var controller = new AbortController();
    setTimeout(() => controller.abort(), 1000);
    return fetch("https://xxxx.xxxx.com", { ...requestOptions, signal: controller.signal })
        .then(response => response.json())
        .then(result => printResult(result))
        .catch(error => console.log('error', error));
}
...