[好文分享] The Basics of Web Workers

商業，創業，美食，葡萄酒，閱讀，網路科技。

這是我的 FB粉專以及 IG，我比較常使用 Threads，歡迎大家追蹤互動~

http://www.html5rocks.com/en/tutorials/workers/basics/

HTML 5 新的規格: Web Workers
https://html.spec.whatwg.org/multipage/workers.html#workers

在此技術之前 JavaScript 是單執行緒的，所以如果在 client 端做 computationally intensive 的工作 (ex: image processing)，通常頁面會 hang 住，再點頁面就會跳 warning dialog 之類。

Web Worker 的開啟相當簡單，在 caller side 下：

var worker = new Worker('task.js');
worker.postMessage(); // Start the worker.

postMessage 是 main thread 與 worker thread 溝通的方法 (當然兩端都要註冊 message handler)。另外上面連結還有提到：

1. Transferrable objects：C / C++ pass by reference 的概念。只要用 Transferrable Objects 規範內的 data type，搭配特定 postMessage prototype，就可以達到 object pass by reference，大幅提升 post 物件的效能 (本來是 pass by value)。

2. Subworkers：worker thread 可以再生成 worker thread。

3. Inline Workers：worker script 不用寫死在 js 檔裡，在 caller 端先產生 Blob 再產生 Worker。

4. Handling Errors：在 main thread 宣告 onError function 接 worker thread 丟出來的 error。

5. Same Origin Consideration：worker scripts and the webpage must be from the same origin。