1. 主线程的烦恼
😫
JS 主线程:
"我既要负责渲染界面,又要响应点击,还要算这道一亿次的循环题!我卡住了,别催我!"
当执行大量计算时,HTML 页面会完全冻结,用户点什么都没反应。这是因为 JavaScript 同一时间只能做一件事。
2. 召唤分身 (Web Worker)
Web Worker 是运行在后台的 JavaScript,独立于主线程,互不干扰。
🥷
Worker 分身:
"主人,把重活交给我。你在前台尽管玩,我算好了发短信告诉你。"
var w = new Worker("demo_workers.js");
w.onmessage = function(event) {
console.log("分身算出来了: " + event.data);
};
w.terminate();
3. 分身守则
虽然分身很强,但也有禁忌:
- 🚫 不能操作 DOM (不能修改 HTML 元素)。
- 🚫 不能访问 window, document, parent。
- ✅ 可以使用 JS 核心功能 (Array, String, Date, Math 等)。
- ✅ 可以发送 AJAX 请求。
🧮 后台计数器演示
下面的计数器由 Worker 在后台运行,即使你疯狂点击页面其他地方,它也不会卡顿。
0