摘要:事實(shí)上,瀏覽器內(nèi)部的運(yùn)行機(jī)制是,先將通信內(nèi)容串行化,然后把串行化后的字符串發(fā)給子線程,后者再將它還原。當(dāng)一個的文檔列表中的任何一個對象都是處于完全活動狀態(tài)的時候,這個會被稱之為需要激活線程。
瀏覽器中的Web Worker 背景介紹
我們都知道JavaScript這個語言在執(zhí)行的時候是采用單線程進(jìn)行執(zhí)行的,也就是說在同一時間只能做一件事,這也和這門語言有很大的關(guān)系,采用同步執(zhí)行的方式進(jìn)行運(yùn)行,如果出現(xiàn)阻塞,那么后面的代碼將不會執(zhí)行,HTML5則提出了web Worker標(biāo)準(zhǔn),表示JavaScript允許有多個線程,但是子線程完全受主線程的控制,子線程不能操作DOM,只有主線程可以操作DOM,所以以主線程為主的單線程執(zhí)行原理成了JavaScript這門語言的核心。
進(jìn)程與線程的區(qū)別根本區(qū)別:進(jìn)程是操作系統(tǒng)資源分配的基本單位,而線程是任務(wù)調(diào)度和執(zhí)行的基本單位。
在操作系統(tǒng)中能同時運(yùn)行多個進(jìn)程(程序);而在同一個進(jìn)程(程序)中有多個線程同時執(zhí)行。
簡單來說,其實(shí)就是在Javascript單線程執(zhí)行的基礎(chǔ)上,開啟一個子線程,進(jìn)行程序處理,而不影響主線程的執(zhí)行,當(dāng)子線程執(zhí)行完畢之后再回到主線程上,在這個過程中并不影響主線程的執(zhí)行過程。
舉個栗子
傳統(tǒng)情況下,執(zhí)行下面的代碼后,整個頁面都會被凍結(jié),由于javascript是單線程處理,如下代碼已經(jīng)完全組塞了后續(xù)的執(zhí)行
while(1){}
如果換一種方式,我們通過開啟一個新的線程來執(zhí)行這段代碼,將他放在一個多帶帶的worker.js文件中,在主線程執(zhí)行以下代碼,則可以避免這種情況。
var worker = new Worker("worker.js")Web Worker的用法 判斷當(dāng)前瀏覽器是否支持web worker
if (typeof (Worker) != "undefined") { //瀏覽器支持web worker if (typeof (w) == "undefined") { //w是未定義的,還沒有開始計數(shù) w = new Worker("webworker.js"); //創(chuàng)建一個Worker對象,利用Worker的構(gòu)造函數(shù) } //onmessage是Worker對象的properties w.onmessage = function (event) { //事件處理函數(shù),用來處理后端的web worker傳遞過來的消息 // do something }; } else { // 瀏覽器不支持web worker // do something }API
①創(chuàng)建新的Worker
var worker = new Worker("worker.js")
②傳遞參數(shù)
worker.postMessage()
③接收消息
worker.onMessage = function(msg){}
④異常處理
worker.onerror = function(err){}
⑤結(jié)束worker
worker.terminate()
⑥載入工具類函數(shù)
importScripts()Worker作用域
當(dāng)我們創(chuàng)建一個新的worker時,該代碼會運(yùn)行在一個全新的javascript的環(huán)境中(WorkerGlobalScope)運(yùn)行,是完全和創(chuàng)建worker的腳本隔離,這時我們可以吧創(chuàng)建新worker的腳本叫做主線程,而被創(chuàng)建的新的worker叫做子線程。
WorkerGlobalScope是worker的全局對象,所以它包含所有核心javascript全局對象擁有的屬性如JSON等,window的一些屬性,也擁有類似于XMLHttpRequest()等。
但是我們所開啟的新的worker也就是子線程,并不支持操作頁面的DOM。
主線程與子線程數(shù)據(jù)通信方式有多種,通信內(nèi)容,可以是文本,也可以是對象。需要注意的是,這種通信是拷貝關(guān)系,即是傳值而不是地址,子線程對通信內(nèi)容的修改,不會影響到主線程。事實(shí)上,瀏覽器內(nèi)部的運(yùn)行機(jī)制是,先將通信內(nèi)容串行化,然后把串行化后的字符串發(fā)給子線程,后者再將它還原。
JavaScript中的數(shù)據(jù)類型存放原理以及傳遞規(guī)則 共享線程(SharedWorker)共享線程是為了避免線程的重復(fù)創(chuàng)建和銷毀過程,降低了系統(tǒng)性能的消耗,
共享線程SharedWorker可以同時有多個頁面的線程鏈接。
使用SharedWorker創(chuàng)建共享線程,也需要提供一個javascript腳本文件的URL地址或Blob,該腳本文件中包含了我們在線程中需要執(zhí)行的代碼,如下:
var worker = new SharedWorker("sharedworker.js");
共享線程也使用了message事件監(jiān)聽線程消息,但使用SharedWorker對象的port屬性與線程通信如下:
worker.port.onmessage = function(msg){};
同時我們也可以使用SharedWorker對象的port屬性向共享線程發(fā)送消息如下:
worker.port.postMessage(msg);運(yùn)行原理 生命周期
①當(dāng)一個web worker的文檔列表不為空的時候,這個web worker會被稱之為許可線程。
②當(dāng)一個web worker的文檔列表中的任何一個對象都是處于完全活動狀態(tài)的時候,這個web worker會被稱之為需要激活線程。
③當(dāng)一個web worker是許可線程并且擁有計數(shù)器或者擁有數(shù)據(jù)庫事務(wù)或者擁有網(wǎng)絡(luò)連接或者它的web worker列表不為空的時候,這個web worker會被稱之為受保護(hù)的線程。
④當(dāng)一個web worker是一個非需要激活線程同時又是一個許可線程的時候,這個web worker會被稱之為可掛起線程。
1.可以加載一個JS進(jìn)行大量的復(fù)雜計算而不掛起主進(jìn)程,并通過postMessage,onmessage進(jìn)行通信
2.可以在worker中通過importScripts(url)加載另外的腳本文件
3.可以使用 setTimeout(), clearTimeout(), setInterval(), and clearInterval()
4.可以使用XMLHttpRequest來發(fā)送請求
5.可以訪問navigator的部分屬性
1.不能跨域加載JS
2.worker內(nèi)代碼不能訪問DOM
3.各個瀏覽器對Worker的實(shí)現(xiàn)不大一致,例如FF里允許worker中創(chuàng)建新的worker,而Chrome中就不行
4.不是每個瀏覽器都支持這個新特性
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/102534.html
摘要:監(jiān)聽線程返回的信息父進(jìn)程接收的數(shù)據(jù)主線程關(guān)閉線程線程一旦新建成功,就會始終運(yùn)行,這樣有利于隨時響應(yīng)主線程的通信。幸運(yùn)的是,提供了一中轉(zhuǎn)移數(shù)據(jù)的方式,允許主線程把二進(jìn)制數(shù)據(jù)直接轉(zhuǎn)移給子線程。 showImg(https://segmentfault.com/img/remote/1460000017153372?w=1200&h=581); 我們都知道,JavaScript 是單線程的,...
摘要:事件循環(huán)背景是一門單線程非阻塞的腳本語言,單線程意味著,代碼在執(zhí)行的任何時候,都只有一個主線程來處理所有的任務(wù)。在意識到該問題之際,新特性中的可以讓成為一門多線程語言,但實(shí)際開發(fā)中使用存在著諸多限制。這個地方被稱為執(zhí)行棧。 事件循環(huán)(Event Loop) 背景 JavaScript是一門單線程非阻塞的腳本語言,單線程意味著,JavaScript代碼在執(zhí)行的任何時候,都只有一個主線程來...
閱讀 3514·2023-04-25 20:09
閱讀 3720·2022-06-28 19:00
閱讀 3035·2022-06-28 19:00
閱讀 3058·2022-06-28 19:00
閱讀 3132·2022-06-28 19:00
閱讀 2859·2022-06-28 19:00
閱讀 3014·2022-06-28 19:00
閱讀 2610·2022-06-28 19:00