HTML5 Web workers

1. What Web Worker can do?

• Caching data for use in your pages.
• Processing large amounts of data in arrays or large JSON response from web service.
• Managing a database connection along with adding and removing records for the main page.
• Automated race track betting agent.
• Analyzing video.
• Spell checking the page s the user types.
• Polling web services and alerting the main page when something happens.
• Image processing of data in a canvas.
• Code syntax or other language highlighting.
• Pre-fetching data based on what your user is doing.
• Managing advertising for your page.

2. keys to use HTML5 Web Workers

• Without Web Workers, Javascript is a single-threaded, meaning it can do only one thing at a time.
• If you give a JavaScript program too much to do, you might get the slow script dialog.
• Web workers handle tasks on a separate thread so your main JavaScript code can continue to run and your UI remains responsive.
• The code for a Web worker is in a separate file from your page’s code.
• Web workers don’t have access to any of the functions in the code in your page or the DOM.
• The code in your page and the web worker communicate via messages.
• To send a message to a worker, use PostMessage.
• Your can send strings and objects to a worker via postMesage, you can’t send functions to a worker.
• Receive messages back from workers by setting the worker’s onmessage property to a handler function.
• A worker receives messages from the code in your page by setting its onmessage property to a handler function.
• When a worker is ready to send back a result, it calls postMessage and passes the result as the argument.
• Worker results are encapsulated in an event object and placed in the data property.
• You can find out which worker sent the message using the event.target property.
• Messages are copied, not shared, btw your main page code and the worker.
• You can use multiple workers for large computations that can be split into multiple tasks, such as computing a fractal visualization or ray tracing an image.
• Each worker runs in its own thread, so if your computer has a multicore processor, the workers are run in parallel, which increases the speed of the computation.
• You can terminate a worker by calling worker.terminate() form the code in your page. This will abort the worker script. A worker can also stop itself by calling close().
• Workers also have an onerror property. You can set this to an error handling function that will be called if your worker has a script error.

• To include and use JavaScript libaries in your worker file, use importScripts.

  //You can also use importScripts with  JSONP.
  //Implement the callback you pass in the URL query in the worker file.
  function makeServerRequest() {
    importScripts(('http://someserver.com?callback=handleRequest');
  }
  function handleRequest(response) {
    postMessage(response);
  }
  makeServerRequest();

• While workers do not have assess to the DOM or functions in your main codes, they can use XMLHttpRequest and Local Storage.