什麼是Web Worker？，它就是個運行在後台的Javascript，獨立於其它Script，並且不會影響效能，但它不能影響Dom、並不能訪問windows、Document、parent等物件。
Worker 主要的用處在避免重度 CPU 運算的任務阻礙到 UI 執行緒運行。
建立Worker
首先我們來建立worker，並且該獨立的script為work.js，並且在worker建立onmessage監聽器，當work.js有執行postMessage()，則會觸發。
var worker = new Worker('work.js');
worker.onmessage = function(e){
console.log(e.data);
}
下面這段程式碼為work.js，以下只是段簡單的兩秒後觸發postMessage()並回傳一段文字回去。
(fucntion(){
setTimeout(function(){
postMessage('This work I spend 2s');
},2000);
})();
兩秒後執行結果就為。
This work I spend 2s
在 Web Worker 中載入 Javascript
在Worker裡面如果要載入Javascript，則需要使用importScripts( "fileName.js" ) ，下列程式碼為使用範例。
importScripts( "work2.js" )
var work2Obj = work2Obj;
(function(){
console.log(work2Obj.taskName);
setTimeout(function(){
self.postMessage('This work , I spend 2 s ');
},2000);
})()
work2.js，如下程式碼。
var work2Obj = {
taskName:"work2"
}
Web Worker的限制
有幾點要web worker的限制需要注意一下。
- 不能跨域加載Js。
- Worker不能訪問windows、Document、parent等物件。
- 各瀏覽器對Worker的實現不太一樣。