SharedWorker

1,377 阅读2分钟

携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第20天,点击查看活动详情

大家好!我是前端爬楼工程师🚹,一个野生程序员。好奇新技术,仰慕牛大佬。如果喜欢我的文章,可以关注➕点赞,为我注入能量,与我一同成长吧~


上篇文章我们说了对于同一个URL生成的多个实例是完全独立的Worker。那如果是同一个页面多个tab的情况下,我门不希望有重复的Worker,最常见的解决方式就是socket网络连接,还有一种方式就是创建共享的Worker(SharedWorker)。

var w1 = new SharedWorker("http://some.url.1/mycoolworker.js") // 仅支持Chrome和FireFox

那么多个页面是如何通过共享Worker来通信的呢?是使用Worker的port对象。

// 外部主线程
w1.port.addEventListener("message",handleMessage)
w1.port.postMessage("something cool")
// 开启连接
w1.port.start() 

另外还要处理一个额外的事件connect.

// SharedWorker内部
addEventListener("connect", function(evt){
    var port = evt.ports[0]
    port.addEventListener("message", function(evt){
        port.postMessage(..) 
    })
    port.start() // 初始化端口连接
})

模拟Web Worker

我们知道Wokrer不支持更老的浏览器,所以我们需要模拟多线程,IFrame其实和主页面是在同一个线程中,不支持并发。参考这里

SMID

单指令多数据(SIMD)是一种数据并行方式,与WebWorker的任务并行相对。这里可以并行处理数据的多个位。SIMD JavaScript向JavaScript暴露短向量类型和API。这样处理数据密集型应用带来的性能收益是非常大的。

var v1 = SIMD.float32*4(3.14159,21.0,32.3,55.55)
var v2 = SIMD.float32*4(2.1,3.2,4.3,5.4)
var v3 = SIMD.int32*4(10,101,1001,10001)
var v4 = SIMD.int32*4(10,20,30,40)

SIMD.float32*4.mul(v1,v2)
SIMD.int32*4.add(v3,v4)

asm.js

JavaScript语言中可以高度优化的一个子集。被JavaScript引擎识别并进行特别激进的底层优化。

关于asm.js的风格代码,你可以通过编译工具Emscripten来实现。

对JavaScript性能影响最大的因素是内存分配、垃圾收集和作用域访问。