PHYSICAL ISOLATION LAB

SAB + OffscreenCanvas

📡 Jitter-Pulse V3 — 物理示波器

OffscreenCanvas + SAB + Worker rAF

■ 绿线物理基准 ΔT(线程隔离,Jitter ≈ 0)   ■ 黄线主线程心跳延迟(阻塞时断崖飙升)   ● 红点STW 尖峰(>50ms)

● MAIN-LAG 黄线:主线程心跳延迟(卡死时飙升) ·● BASELINE 绿线:物理基准 ΔT(线程隔离引擎)

正在检测 SharedArrayBuffer...

LAG: 0.00ms|WΔT: 0.00ms

物理法则:主线程每帧把 performance.now() 写入 SAB[0];Worker 独立 rAF 读取并算延迟。 主线程阻塞时画面继续滚动(渲染权在 Worker),黄线垂直飙升出断崖尖峰。

🧪

Payload Injector — 主线程毒药注射器

在下方编写任意 JavaScript 代码,点击 「注入主线程」执行。你的代码将通过 new Function() 在主线程同步运行。
观察上方的 Jitter-Pulse 波形:黄线会断崖式飙升(主线程心跳停止), 而绿线依然 60fps 丝滑跳动——因为 Worker 拥有 OffscreenCanvas 渲染主权。

🧮 递归斐波那契 fib(42),纯 CPU 密集型,主线程卡死 2-5 秒
1234567891011121314

⚠ 代码在你的浏览器主线程执行,不会发送到服务器。最坏情况:刷新页面即可恢复。

"如果你的代码连这个隔离区都捅不破,
那你在主线程写的那些业务逻辑,也不过是随波逐流的泡沫。"

🔬 为什么绿线不会死?

渲染主权转移

Worker 通过 transferControlToOffscreen() 夺取 Canvas 控制权。主线程死了,Worker 照画。

零拷贝内存共享

SharedArrayBuffer 在 L3 缓存层面共享。无序列化、无事件队列、无 GC 干扰。

独立调度循环

Worker 的 requestAnimationFrame 由浏览器独立调度,不受主线程事件循环阻塞。

"当你掌握了度量衡,你就掌握了秩序。"

[ 实验室信条:红线必须死,绿线万岁 ]