硬件散热能力决定JavaScript持续稳定执行时长；应优先用requestIdleCallback调度、Web Workers隔离计算、预处理Canvas图像、服务端预编译Wasm，避免同步阻塞与高频轮询引发热节流。
硬件散热条件直接决定浏览器能否持续稳定执行 JavaScript 运算——不是“能不能跑”，而是“能跑多久不降频、不卡顿、不丢帧”。选错函数工具或调用方式，被动散热设备上 90 秒就热节流，风冷积灰后 setTimeout 回调延迟翻倍，液冷则完全没必要为前端 JS 上。
用 requestIdleCallback 替代高频 setInterval 控制 CPU 占用
在无风扇设备（如树莓派 Zero 2 W、Intel NUC 被动版）上，setInterval(() => {}, 1) 是最典型的“自毁式写法”：主线程被死锁，CPU 温度 70℃+ 后触发 Thermal Throttling，JS 执行直接变慢 30–50%。而 requestIdleCallback 让浏览器按空闲时间片调度，天然适配散热瓶颈。
- 只在页面空闲时执行，避免抢占渲染和输入响应，显著降低持续发热
- 需配合
timeout参数防饿死：requestIdleCallback(cb, { timeout: 2000 }) - 不支持 Safari（截至 iOS 17.6 / macOS 14.6），需 fallback 到
setTimeout+performance.now()误差补偿 - 实测：树莓派 4B（无风扇）运行 Canvas 动画 + 数据解析，改用
requestIdleCallback后 SoC 温度从 78℃ 降至 62℃，且未再触发降频
避免 JSON.parse() 大文本阻塞主线程
单次解析 >1MB 的 JSON 字符串，在被动散热设备上会引发明显温升——V8 引擎 GC 周期拉长、内存拷贝密集，CPU 单核 100% 持续 3–5 秒，极易触发热节流。这不是数据量问题，而是同步阻塞模式与散热能力的硬冲突。
- 优先拆分：用
fetch().then(r => r.json())让浏览器底层处理，比手动JSON.parse()更省资源 - 大文件必须解析时，用
Web Workers拆离主线程，Worker 内部仍用JSON.parse()，但主线程保持冷却 - 禁用
JSON.parse()前的console.log(str)—— 字符串打印本身会触发 V8 内部字符串驻留，增加 GC 压力 - 注意：Safari 对 Worker 中
JSON.parse()的内存回收更保守，建议加str = null显式释放
Canvas 渲染慎用 ctx.drawImage() 循环调用
在 ARM 或低功耗 x86 设备上，ctx.drawImage() 频繁调用（尤其未做尺寸预缩放）会强制 GPU/CPU 共享内存带宽，导致 SoC 整体升温。实测树莓派 4B 在 60fps 下连续绘制未裁剪图片，GPU 温度 15 秒内飙升至 82℃，随即触发 ctx 绘制丢帧。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
立即学习“前端免费学习笔记（深入）”；
- 务必预处理图像：用
createImageBitmap()提前解码并缩放，避免每次 draw 时重复解码 - 启用
will-change: transform（而非opacity）配合transform: translate()移动 canvas 内容，走硬件合成通路 - 禁用
canvas.style.imageRendering = 'pixelated'—— 此属性在多数嵌入式浏览器中强制回退到 CPU 渲染 - 检查是否启用了
desynchronized: true创建 canvas，可减少 vsync 等待，降低渲染线程驻留时间
WebAssembly 模块编译阶段要防 CPU 持续满载
WebAssembly.compile() 和 WebAssembly.instantiate() 是纯 CPU 密集型操作，在散热受限设备上极易成为温度爆点。一次 500KB wasm 模块编译可能让 CPU 温度 10 秒内上升 20℃，随后触发浏览器主动延迟后续编译任务。
- 预编译优先：服务端用
wabt或wasm-opt提前优化，减小体积和编译耗时 - 避免动态
fetch+compile组合；改用instantiateStreaming()直接加载已编译模块 - 对非关键路径 wasm（如日志压缩、非实时解密），加
setTimeout延迟 200ms 再执行，给 CPU 散热间隙 - Chrome 126+ 支持
WebAssembly.compileStreaming()的signal参数，可配合AbortController实现超温中断，但需自行监听温度 API（如通过 Node.js 桥接）
真正卡住前端性能的，从来不是“某一个函数”，而是函数调用节奏与硬件散热能力之间的失配。风冷要看灰尘，被动散热要看负载持续时间，液冷对 JS 几乎无效——把 requestIdleCallback 当成默认调度器，把 Web Workers 当成散热隔离墙，比换硅脂管用十倍。
