如何实现网页多标签tab通讯

例如打开两个 chrome 标签，一个访问列表页，一个访问详情页。在详情页修改了标题，列表页也要同步过来。

使用 webSocket

无跨域限制

需要服务端支持，成本高

通过 localStorage 通讯

同域的 A 和 B 两个页面，可以通过 localStorage 通讯。

A 页面设置 localStorage

B 页面可以监听到 localStorage 值的修改

list 页面

window.addEventListener('storage', event => {
    console.log('key', event.key)
    console.log('newValue', event.newValue)
})

detail 页面

localStorage.setItem('changeInfo', 'xxx')

通过 SharedWorker 通讯

SharedWorker 是 WebWorker 的一种

WebWorker 可开启子进程执行 JS，但不能操作 DOM

SharedWorker 可单独开启一个进程，用于同域页面通讯

Javascript 是单线程的，而且和页面渲染线程互斥。所以，一些计算量大的操作会影响页面渲染。[WebWorker](https://developer.mozilla.or