JavaScript et Threads

Question

Existe-t-il un moyen de faire du multithreading en JavaScript ?

Answer 1

Voir http://caniuse.com/#search=worker pour obtenir les informations de soutien les plus récentes.

Voici l'état du soutien en 2009.

---

Les mots que vous voulez rechercher sur Google sont Fils de travail JavaScript

En dehors de Engrenages il n'y a rien de disponible pour l'instant, mais il y a beaucoup de discussions sur la façon de mettre en œuvre cette solution, donc je suppose qu'il faut surveiller cette question car la réponse changera sans doute à l'avenir.

Voici la documentation pertinente pour Gears : API WorkerPool

Le WHATWG a rédigé un projet de recommandation pour les fils de travail : Travailleurs du Web

Et il y a aussi le programme de Mozilla Fils de travail du DOM

---

Mise à jour : Juin 2009, état actuel de la prise en charge des fils JavaScript par les navigateurs

Firefox 3.5 a des travailleurs web. Quelques démonstrations de travailleurs web, si vous voulez les voir en action :

• Recuit simulé (lien "Essayez-le")
• Space Invaders (lien en fin d'article)
• Benchmark JavaScript MoonBat (premier lien)

Le plugin Gears peut également être installé dans Firefox.

Safari 4 et le WebKit nightlies ont des fils de travail :

• JavaScript Ray Tracer

Chrome est intégré à Gears, ce qui lui permet d'effectuer des threads, même s'il requiert une demande de confirmation de la part de l'utilisateur (et il utilise une API différente de celle des travailleurs web, même s'il fonctionne dans tout navigateur dans lequel le plugin Gears est installé) :

• Démonstration du WorkerPool de Google Gears (ce n'est pas un bon exemple car il s'exécute trop rapidement pour être testé dans Chrome et Firefox, bien qu'IE l'exécute suffisamment lentement pour voir qu'il bloque l'interaction).

IE8 y IE9 ne peut faire des threads qu'avec le plugin Gears installé

Answer 2

Avec les "side-specs" HTML5 il n'y a plus besoin de hacker javascript avec setTimeout(), setInterval(), etc.

HTML5 & Friends présente le javascript Travailleurs du Web les spécifications. Il s'agit d'une API permettant d'exécuter des scripts de manière asynchrone et indépendante.

Liens vers les spécification et un tutoriel .

Answer 3

Il n'y a pas de véritable threading en JavaScript. JavaScript étant le langage malléable qu'il est, il vous permet d'en émuler une partie. Voici un exemple exemple Je suis tombé dessus l'autre jour.

Answer 4

Il n'y a pas de véritable multithreading en Javascript, mais vous pouvez obtenir un comportement asynchrone à l'aide des éléments suivants setTimeout() et les requêtes AJAX asynchrones.

Qu'essayez-vous exactement d'accomplir ?

Answer 5

C'est juste une façon de simuler multithreading en Javascript

Maintenant je vais créer 3 fils qui vont calculer l'addition des nombres, les nombres peuvent être divisés avec 13 et les nombres peuvent être divisés avec 3 jusqu'à 10000000000. Et ces 3 fonctions ne sont pas capables de s'exécuter en même temps, comme le veut la notion de Concurrence. Mais je vais vous montrer une astuce qui permettra à ces fonctions de s'exécuter récursivement en même temps : jsFiddle

Ce code m'appartient.

Partie du corps

    <div class="div1">
    <input type="button" value="start/stop" onclick="_thread1.control ? _thread1.stop() : _thread1.start();" /><span>Counting summation of numbers till 10000000000</span> = <span id="1">0</span>
</div>
<div class="div2">
    <input type="button" value="start/stop" onclick="_thread2.control ? _thread2.stop() : _thread2.start();" /><span>Counting numbers can be divided with 13 till 10000000000</span> = <span id="2">0</span>
</div>
<div class="div3">
    <input type="button" value="start/stop" onclick="_thread3.control ? _thread3.stop() : _thread3.start();" /><span>Counting numbers can be divided with 3 till 10000000000</span> = <span id="3">0</span>
</div>

Partie Javascript

var _thread1 = {//This is my thread as object
    control: false,//this is my control that will be used for start stop
    value: 0, //stores my result
    current: 0, //stores current number
    func: function () {   //this is my func that will run
        if (this.control) {      // checking for control to run
            if (this.current < 10000000000) {
                this.value += this.current;   
                document.getElementById("1").innerHTML = this.value;
                this.current++;
            }
        }
        setTimeout(function () {  // And here is the trick! setTimeout is a king that will help us simulate threading in javascript
            _thread1.func();    //You cannot use this.func() just try to call with your object name
        }, 0);
    },
    start: function () {
        this.control = true;   //start function
    },
    stop: function () {
        this.control = false;    //stop function
    },
    init: function () {
        setTimeout(function () {
            _thread1.func();    // the first call of our thread
        }, 0)
    }
};
var _thread2 = {
    control: false,
    value: 0,
    current: 0,
    func: function () {
        if (this.control) {
            if (this.current % 13 == 0) {
                this.value++;
            }
            this.current++;
            document.getElementById("2").innerHTML = this.value;
        }
        setTimeout(function () {
            _thread2.func();
        }, 0);
    },
    start: function () {
        this.control = true;
    },
    stop: function () {
        this.control = false;
    },
    init: function () {
        setTimeout(function () {
            _thread2.func();
        }, 0)
    }
};
var _thread3 = {
    control: false,
    value: 0,
    current: 0,
    func: function () {
        if (this.control) {
            if (this.current % 3 == 0) {
                this.value++;
            }
            this.current++;
            document.getElementById("3").innerHTML = this.value;
        }
        setTimeout(function () {
            _thread3.func();
        }, 0);
    },
    start: function () {
        this.control = true;
    },
    stop: function () {
        this.control = false;
    },
    init: function () {
        setTimeout(function () {
            _thread3.func();
        }, 0)
    }
};

_thread1.init();
_thread2.init();
_thread3.init();

J'espère que cette méthode vous sera utile.