Chrome: délais d'expiration / intervalle suspendu dans les onglets d'arrière-plan?

Je testais l'exactitude de l' setTimeoututilisation de ce test . Maintenant, j'ai remarqué que (comme prévu) ce setTimeoutn'est pas très précis, mais pour la plupart des appareils pas très inexact. Maintenant, si j'exécute le test dans Chrome et que je le laisse s'exécuter dans un onglet d'arrière-plan (donc, passer à un autre onglet et y naviguer), revenir au test et inspecter les résultats (si le test est terminé), ils sont considérablement modifiés. Il semble que les délais d'attente aient été beaucoup plus lents. Testé dans FF4 ou IE9, cela ne s'est pas produit.

Il semble donc que Chrome suspende ou au moins ralentisse l'exécution de JavaScript dans un onglet sans focus. Impossible de trouver grand-chose sur le net sur le sujet. Cela signifierait que nous ne pouvons pas exécuter de tâches en arrière-plan, comme par exemple la vérification périodique sur un serveur utilisant des appels XHR et setInterval(je soupçonne de voir le même comportement pour setInterval, écrira un test si le temps est avec moi).

Quelqu'un at-il rencontré cela? Y aurait-il une solution de contournement pour cette suspension / ralentissement? Appelleriez-vous cela un bogue et devrais-je le déclarer comme tel?

J'ai récemment posé une question à ce sujet et c'est le comportement par conception. Lorsqu'un onglet est inactif, la fonction est appelée au maximum une fois par seconde. Voici le changement de code .

Peut-être que cela aidera: Comment puis-je faire en sorte que setInterval fonctionne également lorsqu'un onglet est inactif dans Chrome?

TL; DR: utilisez Web Workers .

Il existe une solution pour utiliser les Web Workers, car ils s'exécutent dans un processus séparé et ne sont pas ralentis

J'ai écrit un petit script qui peut être utilisé sans modification de votre code - il remplace simplement les fonctions setTimeout, clearTimeout, setInterval, clearInterval

Incluez-le juste avant tout votre code

http://github.com/turuslan/HackTimer

Jouer un son ~ vide oblige le navigateur à conserver les performances - je l'ai découvert après avoir lu ce commentaire: Comment faire fonctionner JavaScript à vitesse normale dans Chrome même lorsque l'onglet n'est pas actif?

J'ai besoin de performances illimitées à la demande pour un jeu par navigateur qui utilise WebSockets, donc je sais par expérience que l'utilisation de WebSockets ne garantit pas des performances illimitées, mais d'après les tests, la lecture d'un fichier audio semble le garantir.

Voici 2 boucles audio vides que j'ai créées à cet effet, vous pouvez les utiliser librement, commercialement: http://adventure.land/sounds/loops/empty_loop_for_js_performance.ogg http://adventure.land/sounds/loops/empty_loop_for_js_performance.wav

(Ils incluent un bruit de -58 dB, -60 dB ne fonctionne pas)

Je les joue, à la demande des utilisateurs, avec Howler.js: https://github.com/goldfire/howler.js

function performance_trick()
{
    if(sounds.empty) return sounds.empty.play();
    sounds.empty = new Howl({
        src: ['/sounds/loops/empty_loop_for_js_performance.ogg','/sounds/loops/empty_loop_for_js_performance.wav'],
        volume:0.5,
        autoplay: true, loop: true,
    });
}

Il est triste qu'il n'y ait pas de méthode intégrée pour activer / désactiver les performances JavaScript complètes par défaut, mais les crypto-mineurs peuvent détourner tous vos threads informatiques à l'aide de Web Workers sans aucune invite: |

J'ai publié le package npm à intervalle de travail qui implémente setInterval et clearInterval avec l'utilisation de Web-Workers pour rester opérationnel sur les onglets inactifs pour Chrome, Firefox et IE.

La plupart des navigateurs modernes (Chrome, Firefox et IE), les intervalles (minuteries de fenêtre) sont fixés pour ne pas se déclencher plus d'une fois par seconde dans les onglets inactifs.

Vous pouvez trouver plus d'informations sur

https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval

https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers#Timeouts_and_intervals

J'ai mis à jour mon noyau jQuery vers la version 1.9.1 et cela a résolu la différence d'intervalle dans les onglets inactifs. J'essaierais d'abord cela, puis j'examinerais d'autres options de remplacement de code.

voici ma solution qui obtient la milliseconde actuelle, et la compare à la milliseconde que la fonction a été créée. pour l'intervalle, il mettra à jour la milliseconde lorsqu'il exécutera la fonction. vous pouvez également saisir l'intervalle / le délai d'expiration par un identifiant.

<script>

var nowMillisTimeout = [];
var timeout = [];
var nowMillisInterval = [];
var interval = [];

function getCurrentMillis(){
    var d = new Date();
    var now = d.getHours()+""+d.getMinutes()+""+d.getSeconds()+""+d.getMilliseconds();
    return now;
}

function setAccurateTimeout(callbackfunction, millis, id=0){
    nowMillisTimeout[id] = getCurrentMillis();
    timeout[id] = setInterval(function(){ var now = getCurrentMillis(); if(now >= (+nowMillisTimeout[id] + +millis)){callbackfunction.call(); clearInterval(timeout[id]);} }, 10);
}

function setAccurateInterval(callbackfunction, millis, id=0){
    nowMillisInterval[id] = getCurrentMillis();
    interval[id] = setInterval(function(){ var now = getCurrentMillis(); if(now >= (+nowMillisInterval[id] + +millis)){callbackfunction.call(); nowMillisInterval[id] = getCurrentMillis();} }, 10);
}

//usage
setAccurateTimeout(function(){ console.log('test timeout'); }, 1000, 1);

setAccurateInterval(function(){ console.log('test interval'); }, 1000, 1);

</script>