Parallel Worker : HTML5 Webworkers implemenation

To overcome the significant javascript limitation of being single threaded came HTML5 Web Wrokers , Providing capablities to fully utilize the latest common multi core processing ability.

ParallelWorker library is an easy to use HTML5 Web Worker implementation.This library provides simple APIs to initialize and manage Web Workers. ParallelWorker also provide advance features such as worker pool and dynamic listeners register/un-registration.

More details about HTML5 Web-Worker : html5rocks - Web Worker;

Basic Usage Design:
3 Step ParallelWorker Usage

//Create a JOB or refer existing JOB

function printPrime(value) {

var primes = [];

for(var i = 2; i < value; i++) {

primes[i] = true;

}

var limit = Math.sqrt(value);

for(var i = 2; i < limit; i++) {

if(primes[i] === true) {

for(var j = i * i; j < value; j += i) {

primes[j] = false;

}

}

}

for(var i = 2; i < value; i++) {

if(primes[i] === true) {

//console.log(i + " " + primes[i]);

postMessage(primes[i])

}

} }

//Create the callback to recieve the results from the worker
var printResult = function(result){

console.log(result);

}

//Create a Workerpool and feed the JOB reference

var workerPool = new workerPool([{

jobName:'listPrimeWorker',

job:listPrime,

listenerList:[printResult]

}]);

//Initiate the Worker
workerPool.listPrimeWorker.dispatchMessage(100);
//Will print all prime no's under 100 without blocking the user

2 true

3 true

5 true

.....

.....

97 true

ParallelJob Creation

JOB is an elementary Javascript method that does not have any reference to another internal/external method as well as does not uses:-
  • The window object
  • The document object
  • The parent object
Consider Job to be as a part of external JS file, that is not included in the current html.
var JOB1 = function(){

                        //Elementry processing intensive operation

                       //send result back to listener/callback usiing postMessage

                       postMessage(result);

                     }

var options = {

	        jobName : 'JOB1',

		onmessage : JOB1

	      }



var parallelJOB1 = new parallelJob(options);

ParallelWorker/WorkerPool Creation

ParallelWorker provides 2 ways to spawn new threads:-
  • Single thread
  • Multiple threads with Worker-Pool
Single Worker Creation
Single Worker can be spawn using a parallelJob instance and a worker unique name.Below is an example where a small parallelJob is created and then used for spawning a new ParallelWorker.

var options = {

jobName : 'testJOB',

onmessage : jobToExecute

}

//ParallelJob Creation
var parallelJOB = new parallelJob(options);
//ParallelWorker Creation
var parallelWORKER = new parallelWorker(parallelJOB);
  • Register Listeners
    Callback can be easily registered to the ParallelWorker as shown below:- parallelWORKER.registerListener(callback1);
  • Un-Register Listeners
    Callbacks can be Un-registered when not needed:- parallelWORKER.unregisterListener(callback1);
  • Initalize the ParallelWorker
    ParallelWorker is initialized with the first call of "dispatchMessage" method with required data. parallelWORKER.dispatchMessage({test:'testData'});
Multiple threads with Worker-Pool
WorkerPool provide additional capabilities for easy thread managment. A workerpool may consist of only one or any number of Workers . WorkerPool can be intialized as following:- var _workerPool = new WorkerPool(<Array of worker definations>); Worker Defination consist of 4 properties:-
  1. jobname : Workers identifier
  2. job: Reference to the JOB
  3. postPublishDestroy: <Boolean>Reference to the JOB
  4. listenerList:<Array> List of all callbacks.

Example:- var jobPool = [{

jobName:'job1',

job:jobExecutor1,

listenerList:[callback1]

},

{

jobName:'job2',

job:jobExecutor2,

postPublishDestroy:true,

listenerList:[callback1,callback2]

}];

var _workerPool = new workerPool(jobPool); Worker-Pool Actions:-

  • Update a JOB
  • Dynamically register/un-register callbacks
  • Collective intialization and destroy capabilities
  • Update a JOB
    var jobPool = [ { jobName:'job1', job:NEWjobExecutor, //postPublishDestroy:true, listenerList:[callback5] }]; _workerPool.updateWorker(jobPool); //new JOB reference
  • Dynamically Register/Un-Register Callbacks _workerPool.job1.listenerList.push(newCallback) //new callback registered for job1 Worker
  • Destroy Complete Worker Pool _workerPool.destroyPool(); //new JOB reference

3 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *