web-dev-qa-db-fra.com

Afficher tous les délais/intervalles en javascript?

J'écris une application qui utilise des délais d'attente et des intervalles JavaScript pour mettre à jour la page. Existe-t-il un moyen de voir combien d'intervalles sont configurés? Je veux m'assurer que je ne vais pas accidentellement tuer le navigateur en configurant des centaines de fois.

Est-ce même un problème?

66
Omar Kooheji

Je ne pense pas qu'il soit possible d'énumérer les minuteries actives, mais vous pouvez remplacer window.setTimeout et window.clearTimeout et les remplacer par vos propres implémentations qui effectuent un suivi, puis appellent les originaux.

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);
};

Bien sûr, vous n’appelez peut-être pas toujours clearTimeout, mais cela vous donnerait au moins un moyen de suivre ce qui se passe au moment de l’exécution.

64
Paul Dixon

J'ai créé une extension Chrome DevTools qui affiche tous les intervalles. Ceux qui ont été nettoyés sont grisés.

Timers Chrome Devtool extension

setInterval-sniffer

25
NVI

Vu que Paul n'a couvert que setTimeout, j'ai pensé partager un compteur pour 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);
};
10
crv

Au lieu de simplement avoir un nombre de minuteries, voici une implémentation qui stocke tous les minidid dans un tableau. Il ne montre que timers actifs tandis que la réponse acceptée compte uniquement les appels à 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));

Voici comment vous pouvez obtenir le nombre de minuteries actives sur la page:

timers.length;

Voici comment vous pouvez supprimer tous les minuteries actives:

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

Limites connues:

  • Vous ne pouvez transmettre une fonction (pas une chaîne) à setTimeout avec ce patch de singe.
  • La fonction suppose que clearInterval et clearTimeout font la même chose, ce qu'ils font mais cela pourrait changer dans le futur.
8
A1rPun

Nous venons de publier un paquet résolvant ce problème précis.

npm install time-events-manager

Avec cela, vous pouvez les visualiser et les gérer via l'objet timeoutCollection (et les intervalles de javascript via l'objet intervalCollection).

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

4
Ziv polack

Je voulais juste quelque chose comme ça et c'est ce que j'ai mis en place:

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);

Ceci enregistre les identifiants d'intervalle avec leurs fonctions, et garde également une trace de leur statut (actif/inactif).

0
akinuri