worker-dom
worker-dom 介绍
worker-dom正在进行（如在非常alpha中）的DOM API实现，旨在在Web Worker中运行。
目的：将与DOM突变相关的中间工作的复杂性移至后台线程，仅向前台线程发送必要的操作。
用例：
通过在文档中的其他位置进行异步更新来保留高优先级更新的主线程可用性。
为了在 Web Workers 内部实现 DOM 的完整表示，WorkerDOM 提供了一种用 TypeScript 编写的高效传输机制。谷歌 AMP 项目技术负责人 Malte Ubl 在 WorkerDOM 的公告中是这样说的：
WorkerDOM 对服务器渲染的 DOM 进行“注水（ hydrate）”，然后在应用程序对页面进行更改时进行代理“修改（mutation）”，例如对用户操作做出响应或运行动画。
WorkerDOM 可以通过 npm 或 yarn 安装：
npm install @ampproject/worker-dom
yarn add @ampproject/worker-dom
用法
WorkerDOM有两种形式，全局变体和模块变体。可以直接或通过捆绑包在文档中包含WorkerDOM主线程代码。以下是您可以直接执行的操作：
<script src="path/to/workerdom/dist/main.mjs" type="module"></script>
<script src="path/to/workerdom/dist/main.js" nomodule defer></script>
WorkerDOM允许我们升级文档的特定部分以由工作人员驱动。例如，想象一下div页面中的节点如下：
<div src="hello-world.js" id="upgrade-me"></div>
要使用模块版本的代码升级此节点，我们可以直接导入upgradeElement并使用它，如下所示：
<script type="module">
import {upgradeElement} from './dist/main.mjs';
upgradeElement(document.getElementById('upgrade-me'),'./dist/worker/worker.mjs');
</script>
nomodule格式公开全局MainThread，并可以div通过以下方式升级：
<script nomodule async=false defer>
document.addEventListener('DOMContentLoaded',function() {
MainThread.upgradeElement(document.getElementById('upgrade-me'),'./dist/worker/worker.js');
},false);
</script>
GitHub:https://github.com/ampproject/worker-dom
网站描述:实现运行在一个Web Worker中的 DOM API 和框架