Mon article précédent, "JavaScript Execution and Browser Limits", a discuté de la façon dont les principaux navigateurs gèrent le code JavaScript à long terme et déclenchent des erreurs "Script non répondu". Étant donné que la modification du comportement du navigateur n'est pas possible et que le traitement côté serveur n'est pas toujours une option, les minuteries offrent une solution pratique pour exécuter de longues tâches sans geler le navigateur.
Que sont les minuteries JavaScript?
Les minuteries JavaScript vous permettent de planifier l'exécution du code après un retard spécifié. Ils fournissent deux fonctions principales:
setTimeout(function, msec[, arg1 … argN])
: Exécute la fonction fournie une fois après msec
millisecondes. Les arguments facultatifs peuvent être transmis à la fonction. setInterval(function, msec[, arg1 … argN])
: similaire à setTimeout
, mais exécute à plusieurs reprises la fonction chaque msec
millisecondes jusqu'à annulation. clearTimeout()
et clearInterval()
sont utilisés pour annuler respectivement les opérations setTimeout
et setInterval
. Par exemple:
var timerID = setTimeout(myfunction, 500); clearTimeout(timerID); // myfunction() will never be called
Remarques importantes:
setTimeout
et setInterval
accepter une fonction référence (pas de parenthèses). setTimeout(myfunction(), 500);
exécuterait myfunction()
immédiatement. setTimeout(f1, 50); setTimeout(f2, 50);
pourrait exécuter f2()
d'abord. pseudo-threading basé sur la minuterie
Étant donné que le code chronométré ne s'exécute pas immédiatement, le thread principal du navigateur est libéré pour d'autres tâches. Cela nous permet de décomposer de longs processus en morceaux plus petits. Par exemple, pour exécuter des fonctions f1()
, f2()
et f3()
séquentiellement:
function ProcessThread(func) { var ms = 20; setTimeout(function() { func.shift()(); if (func.length > 0) { //Improved condition check setTimeout(arguments.callee, ms); } }, ms); } ProcessThread([f1, f2, f3]);
func.shift()
supprime et renvoie le premier élément (une fonction) du tableau, qui est ensuite exécuté. ProcessThread
exécute toutes les fonctions du tableau avec un délai de 20 ms entre chacun. Cette approche fonctionne pour un nombre de fonctions, à condition qu'aucune fonction ne dépasse le seuil de délai d'expiration du navigateur. Cependant, le traitement de grands ensembles de données nécessitera des techniques plus robustes, qui seront couvertes dans un prochain article.
Questions fréquemment posées (FAQ)
La section suivante répond aux questions courantes sur les minuteries JavaScript et le pseudo-threading. La section FAQ d'origine a été réorganisée et réécrite pour plus de clarté et de concision. Des exemples spécifiques ont été simplifiés.
Qu'est-ce que le pseudo-threading dans JavaScript? La nature unique de JavaScript signifie qu'elle gère une tâche à la fois. Le pseudo-threading simule le multi-threading en décomposant de longues tâches en parties plus petites, en planifiant leur exécution avec des minuteries, permettant au navigateur de gérer d'autres tâches entre les deux.
Comment fonctionne un temporisateur JavaScript? setTimeout()
exécute une fonction une fois après un retard, tandis que setInterval()
exécute à plusieurs reprises une fonction à un intervalle donné.
Comment implémenter le pseudo-threading à l'aide de la minuterie JavaScript? Utiliser setInterval()
pour exécuter des morceaux de fonction à intervalles. Arrêtez-vous avec clearInterval()
.
Limitations du pseudo-threading? Il ne permet pas une vraie exécution parallèle; Les tâches s'exécutent séquentiellement, bien qu'avec les tâches de navigateur entrelacées. Un morceau lent retarde les suivants.
pseudo-threading vs threading réel (par exemple, python)? Le multi-threading de Python permet un véritable parallélisme, mais introduit des complexités comme les conditions de course. Le pseudo-threading de JavaScript est plus simple mais moins performant pour les tâches liées au processeur.
Alternatives au pseudo-threading (promesses, async / attend)? promises et async/await
sont supérieures aux opérations asynchrones, mais pas pour les tâches liées au CPU qui bloquent le fil principal.
Arrêter un pseudo-thread? Utiliser clearInterval()
.
Pseudo-threading et travailleurs Web? combiner pseudo-threading dans web travailleurs pour améliorer des performances; Les travailleurs fonctionnent en arrière-plan.
Applications pratiques du pseudo-threading? Traitement d'images, calculs complexes, manipulation de données, etc. Tout ce qui pourrait bloquer le thread principal.
Bibliothèques / frameworks pour le pseudo-threading? Bien qu'il ne soit pas directement concentré sur le pseudo-thread, des bibliothèques comme async.js
peuvent aider à gérer les opérations asynchrones. Les minuteries intégrées de JavaScript sont généralement suffisantes.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!