Visualizando todos os tempos limite / intervalos em javascript?

88

Estou escrevendo um aplicativo que utiliza intervalos e tempos limite de JavaScript para atualizar a página. Existe uma maneira de ver quantos intervalos são configurados? Quero ter certeza de que não vou matar acidentalmente o navegador por ter configurado centenas de intervalos.

Isso é mesmo um problema?

Omar Kooheji
fonte

Respostas:

77

Não acho que haja uma maneira de enumerar os temporizadores ativos, mas você pode sobrescrever window.setTimeoute window.clearTimeoute substituí-los por suas próprias implementações que fazem algum rastreamento e, em seguida, chamam os originais.

window.originalSetTimeout = window.setTimeout;
window.originalClearTimeout = window.clearTimeout;
window.activeTimers = 0;

window.setTimeout = function(func, delay) {
    window.activeTimers++;
    return window.originalSetTimeout(func, delay);
};

window.clearTimeout = function(timerID) {
    window.activeTimers--;
    window.originalClearTimeout(timerID);
};

Claro, você nem sempre pode ligar clearTimeout, mas isso pelo menos lhe daria alguma maneira de rastrear o que está acontecendo no tempo de execução.

Paul Dixon
fonte
3
Usei isso em algum código hoje, mas precisei activeTimersdecrementar quando nãoclearTimeout foi chamado. Isso é facilmente realizado substituindo a segunda linha por este: window.setTimeoutreturn window.originalSetTimeout(function() {func(); activeTimers--;},delay);
Rick Hitchcock
2
Esta resposta não funcionará mais, pois as funções JavaScript relacionadas ao DOM serão 'imutáveis'.
John Greene
29

Fiz uma extensão do Chrome DevTools que mostra todos os intervalos. Os apagados ficam acinzentados.

Extensão de cronômetros Chrome Devtool

setInterval-sniffer

NVI
fonte
10
Infelizmente, isso parece ter parado de funcionar com o Chrome.
Joseph Lennox
@JosephLennox Esta alternativa funciona, testada agora mesmo: chrome.google.com/webstore/detail/timeouts-and-intervals/…
Trever Thompson
@TreverThompson isso também não funciona.
SeyyedKhandon
11

Visto que Paul abordou apenas setTimeout, pensei em compartilhar um contador para setInterval / clearInterval.

window.originalSetInterval = window.setInterval;
window.originalClearInterval = window.clearInterval;
window.activeIntervals = 0;
window.setInterval = function (func, delay)
{
    if(func && delay){
            window.activeIntervals++;
    }
    return window.originalSetInterval(func,delay);
};
window.clearInterval = function (intervalId)
{
    // JQuery sometimes hands in true which doesn't count
    if(intervalId !== true){
        window.activeIntervals--;
    }
    return window.originalClearInterval(intervalId);
};
crv
fonte
9

Em vez de apenas ter uma contagem de temporizadores, aqui está uma implementação que armazena todos os IDs do temporizador em um array. Mostra apenas os temporizadores ativos, enquanto a resposta aceita conta apenas as chamadas para setTimeout& clearTimeout.

(function(w) {
    var oldST = w.setTimeout;
    var oldSI = w.setInterval;
    var oldCI = w.clearInterval;
    var timers = [];
    w.timers = timers;
    w.setTimeout = function(fn, delay) {
        var id = oldST(function() {
            fn && fn();
            removeTimer(id);
        }, delay);
        timers.push(id);
        return id;
    };
    w.setInterval = function(fn, delay) {
        var id = oldSI(fn, delay);
        timers.push(id);
        return id;
    };
    w.clearInterval = function(id) {
        oldCI(id);
        removeTimer(id);
    };
    w.clearTimeout = w.clearInterval;

    function removeTimer(id) {
        var index = timers.indexOf(id);
        if (index >= 0)
            timers.splice(index, 1);
    }
}(window));

É assim que você pode obter a contagem de temporizadores ativos na página:

timers.length;

É assim que você pode remover todos os temporizadores ativos :

for(var i = timers.length; i--;)
    clearInterval(timers[i]);

Limitações conhecidas:

  • Você só pode passar uma função (não uma string) setTimeoutcom este patch monkey.
  • A função assume clearIntervale clearTimeoutfaz o mesmo, o que eles fazem, mas pode mudar no futuro.
A1rPun
fonte
É possível obter o nome de todos em execução SetIntervals? Por exemplo var timer = setInterval(function () { }, preciso de um cronômetro em vez de contar os intervalos de execução.
Yogesh Patel
Que eu saiba, sugiro uma pesquisa global com a palavra-chave "setInterval" e / ou "setTimeout"
Carles Alcolea
4

Acabamos de publicar um pacote que resolve exatamente esse problema.

npm install time-events-manager

Com isso, você pode visualizá-los e gerenciá-los via timeoutCollectionobjeto (e os intervalos do javascript via intervalCollectionobjeto).

timeoutCollection.getScheduled(); timeoutCollection.getCompleted(); timeoutCollection.getAll();

Ziv polaco
fonte
2
Acho que o OP e a maioria das pessoas estavam procurando algo para digitar no console do navegador como o primeiro PoC e talvez mais tarde em uma extensão. Como alguém faria para colocar isso no console a partir das informações que você deu?
Carles Alcolea
1

Eu só precisava de algo assim e foi isso que eu fiz:

window.setInterval = function (window, setInterval) {
  if (!window.timers) {
    window.timers = {};
  }
  if (!window.timers.intervals) {
    window.timers.intervals = {};
  }
  if (!window.timers.intervals.active) {
    window.timers.intervals.active = {};
  }
  return function (func, interval) {
    var id = setInterval(func, interval);
    window.timers.intervals.active[id] = func;
    return id;
  }
}(window, window.setInterval);

window.clearInterval = function (window, clearInterval) {
  if (!window.timers) {
    window.timers = {};
  }
  if (!window.timers.intervals) {
    window.timers.intervals = {};
  }
  if (!window.timers.intervals.inactive) {
    window.timers.intervals.inactive = {};
  }
  return function (id) {
    if (window.timers.intervals.active && window.timers.intervals.active[id]) {
      window.timers.intervals.inactive[id] = window.timers.intervals.active[id];
      clearInterval(id);
      delete window.timers.intervals.active[id];
    }
  }
}(window, window.clearInterval);

Isso registra o intervalo ids junto com suas funções e também mantém o controle de seu status ( active/ inactive).

Akinuri
fonte