JavaScript multithreading

Web Workers. They’re a W3C standard (well, a working draft at the moment) for exactly this, and require no plugins:

This specification defines an API that allows Web application authors to spawn background workers running scripts in parallel to their main page.

The specification also discusses spreading workers across multiple cores, for true concurrency (this is handled invisibly by the browser’s JavaScript engine):

With multicore CPUs becoming prevalent, one way to obtain better performance is to split computationally expensive tasks amongst multiple workers. In [one] example, a computationally expensive task that is to be performed for every number from 1 to 10,000,000 is farmed out to ten subworkers.

yield() and setInterval() only schedule things to happen later, they don’t run concurrently with anything else.

I'm wondering - how else can you achieve multithreading in JavaScript? Any other important methods?

You can have your code transformed into JavaScript code that doesn't have any explicit loops or direct function calls, instead code is divided into small units of execution that are managed by a threading engine. In my example code I show how a function with loops would be transformed but I've omitted the mechanism for function calls just to keep the example simple.

The process of transformation basically works by splitting code at division points. These division points are function calls and loops (as demonstrated above). In the example I've used objects and keys but it may be much easier on the browser's JavaScript engines if the units stored the stack as an object variable (i.e. storing using this.foo = bar instead of stack["foo"] = bar).

For example the following code:

// Phoney method purely to demonstrate structurefunction Foo() {  var i,      sum = 0,      accumulator_list = [],      accumulator_modulus = [],      kMaxAccumulatorCount = 100;  // Calculate accumulations  for(i = 0; i < kMaxAccumulatorCount; ++i) {    current_accumulator = GetNextAccumulator()    accumulator_list[i] = current_accumulator;    sum = sum + current_accumulator;  }  // Calculate accumulator modulus  for(i = 0; i < kMaxAccumulatorCount; ++i) {    current_accumulator = accumulator_list[i];    accumulator_modulus[i] = current_accumulator % kMaxAccumulatorCount;  }}

... into something like this:

function Foo_A(caller,stack) {  var stack = {};  stack["i"] = undefined;  stack["sum"] = 0;  stack["accumulator_list"] = [];  stack["accumulator_modulus"] = [];  stack["kMaxAccumulatorCount"] = 100;  stack["i"] = 0;  return {caller: caller, stack: stack, next=Foo_B};}function Foo_B(caller, stack) {  stack["current_accumulator"] = GetNextAccumulator();  stack["accumulator_list"][stack["i"]] = stack["current_accumulator"];  stack["sum"] = stack["sum"] + stack["current_accumulator"];  // For-loop condition satisfied ?  if(stack["i"] < stack["kMaxAccumulatorCount"]) {    ++stack["i"];    return {caller: caller, stack: stack, next:Foo_B};  } else {    // Initialise the next for loop.    stack["i"] = 0;    return {caller: caller, stack: stack, next:Foo_C};  }}function Foo_C(caller, stack) {  stack["current_accumulator"] = stack["current_accumulator"][stack["i"]];  stack["accumulator_modulus"][stack["i"]] = stack["current_accumulator"] % stack["kMaxAccumulatorCount"];  // For-loop condition satisfied ?  if(stack["i"] < stack["kMaxAccumulatorCount"]) {    ++stack["i"];    return {caller: caller, stack: stack, next:Foo_C};  } else {    // Function has finished so the next will be null. When the thread-engine sees this it simulates the behaviour of a return, pops its virtual stack and returns execution to the caller    return {caller: caller, stack: stack, next:null};  }}

Multithread.js is a library for really easy multithreading in JS that wraps Web Workers and does the majority of your work for you. :)