uni-app下Worker的使用示例詳解
1、在static目錄下創(chuàng)建一個目錄用于存放worker文件

為啥要在static目錄下創(chuàng)建worker目錄呢?那是因為worker.js沒辦法在別的js中被引用,uni-app項目編譯成微信小程序代碼時會進(jìn)行Tree-shaking(搖樹優(yōu)化),把那些沒被引用的js文件給剔除掉,放在static目錄下可以避免被搖樹優(yōu)化。
2、在pages.json文件中引用剛創(chuàng)建的worker目錄

注意:pages.json最后一項后面不要有逗號,否則會報錯
3、編寫worker.js(名字任意取,要在上面創(chuàng)建的workers目錄下面)
//MyWorker.js
//用于接收外部消息
worker.onMessage(function(res) {
console.log('worker內(nèi)部線程')
console.log(res)
//用于發(fā)送
worker.postMessage({
message: '收到worker的消息'
});
});4、主線程中創(chuàng)建調(diào)用和銷毀Worker
1、創(chuàng)建Worker
let worker = wx.createWorker('/static/workers/MyWorker.js', {
useExperimentalWorker: true,
});useExperimentalWorker: true 引用官方注釋:是否使用實驗worker。在iOS下,實驗worker的JS運(yùn)行效率比非實驗worker提升近十倍,如需在worker內(nèi)進(jìn)行重度計算的建議開啟此選項。同時,實驗worker存在極小概率會在系統(tǒng)資源緊張時被系統(tǒng)回收,因此建議配合 worker.onProcessKilled 事件使用,在worker被回收后可重新創(chuàng)建一個。
2、發(fā)送消息給Worker線程
worker.postMessage({message:'主線程發(fā)來的消息'})注:需要發(fā)送的消息,必須是一個可序列化的 JavaScript key-value 形式的對象。
3、監(jiān)聽Worker線程的消息
worker.onMessage((res)=>{
console.log('主線程打印的')
console.log(res)
})4、結(jié)束當(dāng)前Worker線程(僅限在主線程 worker 對象上調(diào)用)
worker.terminate()
5、Worker中如何引入其他js
被引入的js文件必須要放在上面創(chuàng)建的Worker目錄內(nèi)部,不然無法引用
在剛創(chuàng)建的workers文件夾下創(chuàng)建一個Test.js文件
//Test.js
function test(){
console.log('我是外部js文件中的內(nèi)容')
}
export default{
test
}MyWorker.js中引入該js
import Test from 'Test.js'
//用于接收外部消息
worker.onMessage(function(res) {
console.log('worker內(nèi)部線程')
console.log(res)
Test.test();//調(diào)用其他js文件中的代碼
//用于發(fā)送
worker.postMessage({
message: '收到worker的消息'
});
});打印結(jié)果:

使用worker注意事項:
- Workers 之間不支持發(fā)送消息。
- Worker 的入??谖募?wx.createWorker() 時指定,開發(fā)者可動態(tài)指定 Worker 入口文件
- Worker 內(nèi)代碼只能 require 指定 Worker 路徑內(nèi)的文件,無法引用其它路徑。
- Worker 最大并發(fā)數(shù)量限制為 1 個,創(chuàng)建下一個前請用 Worker.terminate() 結(jié)束當(dāng)前 Worker。
- Worker 內(nèi)不支持 wx 系列的 API。
到此這篇關(guān)于uni-app下Worker的使用的文章就介紹到這了,更多相關(guān)uni-app Worker使用內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JavaScript實現(xiàn)封裝一個快速生成目錄樹的全局腳本
目錄樹可以很好的介紹項目中各文件目錄的用途,幫助讀者了解整個項目結(jié)構(gòu)。本文就來用JavaScript封裝一個快速生成目錄樹的全局腳本,希望對大家有所幫助2023-03-03
原生JS實現(xiàn)$.param() 函數(shù)的方法
這篇文章主要介紹了原生JS實現(xiàn)$.param() 函數(shù)的方法,由于遇到相關(guān)序列化的問題,但是vue項目中由于減少隊jquery引用的限制,導(dǎo)致不能用$.param來序列化參數(shù),下面小編給大家分享了實例代碼,需要的朋友參考下吧2018-08-08
JS實現(xiàn)關(guān)閉當(dāng)前頁而不彈出提示框的方法
這篇文章主要介紹了JS實現(xiàn)關(guān)閉當(dāng)前頁而不彈出提示框的方法,結(jié)合實例形式分析了JS操作頁面的打開、關(guān)閉及父頁面的關(guān)閉技巧,需要的朋友可以參考下2016-06-06

