Comment les navigateurs pause/modifier le Javascript lors de l'onglet ou la fenêtre n'est pas active?

Question

Contexte: je suis en train de faire l'interface utilisateur de tests pour détecter si les gens sont en accordant une attention ou pas. Mais, cette question n'est pas sur la page de la visibilité de l'API.

Plus précisément, je voudrais savoir comment mon code Javascript sera affectée si l'onglet n'est pas active ou la fenêtre du navigateur n'est pas active dans les différents navigateurs. J'ai creusé le suivant:

• ios 5 pauses javascript lors de l'onglet n'est pas actif
• setInterval et setTimeout délai est réduit lorsque les onglets ne sont pas actifs - semble de ce juste commencé à apparaître récemment et peut gâcher Jasmin tests unitaires, autour d'autres choses.
• requestAnimationFrame est ralenti lors de l'onglet n'est pas actif (ce qui est raisonnable, ne peut pas penser pourquoi cela aurait une incidence sur quelqu'un de trop)

J'ai les questions suivantes:

• Autres que les navigateurs mobiles, ne les navigateurs de bureau, jamais de pause JS exécution lorsqu'un onglet est pas active? Quand et navigateurs?
• Quels sont les navigateurs réduire l' setInterval répéter? Est-il juste réduit à une limite ou par un pourcentage? Par exemple, si j'ai un 10ms répéter par rapport à une 5000ms répéter, comment seront-ils touchés?
• Ces changements se produire si la fenêtre est de l'accent, par opposition à l'onglet? (J'imagine qu'il serait plus difficile à détecter, car elle nécessite le système d'exploitation de l'API.)
• Existe-il d'autres effets qui ne seraient pas observés dans un onglet actif? Ils pourraient gâcher les choses qui serait autrement exécuter correctement (c'est à dire la susmentionnés Jasmin tests)?

Answer 1

Test D'Un

J'ai écrit un test spécialement à cette fin:
Cadence de Distribution: setInterval vs requestAnimationFrame

^{Remarque: Ce test est très consommateur d'UC. requestAnimationFrame n'est pas pris en charge par IE (sauf IE 10) et de l'Opéra.}

Le test de journaux le temps réel qu'il faut pour un setInterval et requestAnimationFrame à exécuter dans les différents navigateurs, et vous donne les résultats sous la forme d'une distribution. Vous pouvez modifier le nombre de millisecondes pour setInterval pour voir comment il fonctionne sous différents réglages. setTimeout fonctionne de façon similaire à un setInterval avec le respect des délais. requestAnimationFrame généralement les valeurs par défaut pour le 60fps en fonction du navigateur. Pour voir ce qui se passe lorsque vous basculez vers un autre onglet ou avoir une fenêtre inactive, il suffit d'ouvrir la page, passer à un autre onglet et attendre pendant un certain temps. Il continue d'enregistrer le réel le temps qu'il faut pour que ces fonctions dans un onglet inactif.

Test De Deux

Une autre façon de tester est de vous connecter à l'horodatage à plusieurs reprises avec setInterval et requestAnimationFrame et l'afficher dans un décollement de la console. Vous pouvez voir comment il est fréquemment mis à jour (ou si elle est jamais mis à jour) lorsque vous faites l'onglet ou la fenêtre inactive.

• Test pour setInterval
• Test pour requestAnimationFrame

Résultats

Internet Explorer
IE ne limite pas le retard dans l' setInterval lorsque l'onglet est inactif. Cependant, IE10 pauses requestAnimationFrame dans les onglets inactifs. Il n'a pas d'importance si la fenêtre est de se concentrer ou pas.

Safari
Safari ne fait pas de pauses setInterval lorsque l'onglet ou la fenêtre est inactive. Il continue de fonctionner à la normale intervalles répétés, comme si l'onglet ou la fenêtre est toujours active. requestAnimationFrame est en pause dans les onglets inactifs.

Firefox
Firefox limites de l'intervalle minimum de setInterval autour de 1000ms lorsque l'onglet est inactif. Si l'intervalle est supérieur à 1000ms, il sera exécuté à l'intervalle spécifié. Il n'a pas d'importance si la fenêtre est de se concentrer, l'intervalle est limitée uniquement lorsque vous basculez vers un autre onglet. requestAnimationFrame est plafonné à un cadre par de 1 à 3 secondes lorsque l'onglet est inactif.

// The default shortest interval/timeout we permit
#define DEFAULT_MIN_TIMEOUT_VALUE 4 // 4ms
#define DEFAULT_MIN_BACKGROUND_TIMEOUT_VALUE 1000 // 1000ms

^{https://hg.mozilla.org/releases/mozilla-release/file/0bf1cadfb004/dom/base/nsGlobalWindow.cpp#l296}

Chrome
Similaire à Firefox, Chrome limites de l'intervalle minimum de setInterval autour de 1000ms lorsque l'onglet (pas de la fenêtre) est inactif. requestAnimationFrame est en pause lorsque l'onglet est inactif.

// Provides control over the minimum timer interval for background tabs.
const double kBackgroundTabTimerInterval = 1.0;

^{https://codereview.chromium.org/6546021/patch/1001/2001}

Opéra
L'opéra n'a pas de limite de setInterval lorsque l'onglet est inactif. requestAnimationFrame n'est pas pris en charge.

Résumé

Répéter à intervalles onglets inactifs:

           setInterval requestAnimationFrame
IE pas affecté en pause
Safari pas affecté en pause
Firefox >=1000ms 1s - 3s
Chrome >=1000ms pause
L'opéra de pas touché pas pris en charge

Answer 2

Ce que j'ai observé : inactif onglets dans Chrome, tous vos setTimeout (doit être le même pour setInterval) en attente de moins de 1000ms sont arrondis à 1000ms. Je pense que plus les délais d'attente ne sont pas modifiés.

Semble être le comportement depuis Chrome 11 et Firefox 5.0 : https://developer.mozilla.org/en-US/docs/DOM/window.setTimeout#Inactive_tabs

En outre, je ne pense pas qu'il se comporte de cette façon, lorsque la totalité de la fenêtre est inactive (mais il semble assez facile à étudier).