HTML本身不会导致风扇狂转，真正原因是JS执行、渲染或开发工具持续占用CPU；常见诱因包括未节流的requestAnimationFrame、未防抖的事件监听、高频DOM操作、Canvas动画失控、Web Worker死循环及本地服务配置不当等。
HTML 本身不会导致风扇狂转——所谓“HTML函数”根本不存在，风扇转得快，一定是 JS 执行、渲染或开发工具在后台持续吃 CPU。
为什么浏览器里开个 HTML 页面风扇就响
HTML 是静态标记语言，解析成本极低；真正拉高 CPU 的是绑定在它上面的动态行为。常见触发点包括：
-
requestAnimationFrame里没做节流，每帧都执行重计算或 DOM 操作 -
scroll或resize事件处理器未用debounce/throttle包裹，滚动时每毫秒触发多次 - 用
innerHTML频繁替换大段结构，引发连续 layout + paint + composite - Canvas 动画未控制帧率，
setInterval(() => ctx.fillRect(...), 0)实际跑满 1000+ FPS - Web Worker 里写死
while(true)或密集型for循环，且没调postMessage释放控制权
Live Server、Vite 启动后风扇狂转怎么查
本地服务本身不重，但配置不当或残留进程会让 Node.js 持续满载。关键检查项：
- 终端执行
ps aux | grep -i node（macOS/Linux）或任务管理器搜node.exe（Windows），确认是否多个vite/live-server进程并存 - Vite 项目中检查
vite.config.ts：若server.watch.usePolling设为true，尤其在 NFS 或 Docker 环境下会引发文件系统事件风暴 - VS Code 中禁用
Live Server插件的后台日志轮询：liveServer.settings.donotShowInfoMsg设为true - 确认没同时跑着
npm run dev、tsc --watch、eslint --watch—— 三个监听器在大型项目中足以占满单核
Chrome 标签页和扩展怎么偷偷吃 CPU
浏览器每个标签页是独立渲染进程，DevTools 扩展更是隐形大户：
立即学习“前端免费学习笔记（深入）”；
- 按
Shift+Esc呼出 Chrome 自带任务管理器，重点关注 “内存” 和 “CPU” 列，排序找异常高值 - React DevTools v5 或旧版 Vue Devtools 在组件树 > 200 节点时，响应式依赖追踪开销陡增；Vue 3 项目务必用 v6+
- 禁用所有非必要扩展，尤其 Live Server、ColorZilla、JSON Formatter 这类常驻 DOM 注入型插件
- 访问
chrome://settings/system，关闭 “继续运行后台应用”，防止网页在切换标签后仍保持 WebSocket/定时器活跃
风扇响得异常，但 CPU 占用不高？可能是散热策略问题
某些设备（如 Surface、超薄本）风扇策略激进，温度稍升就提速；也可能是灰尘堵住进风口，实际 CPU 温度已达 85℃+，但系统负载显示只有 30%：
- 用 HWiNFO64 或 Open Hardware Monitor 实时看 CPU 封装温度（Package Temperature），持续 > 80℃ 就需清灰或改善通风
- Surface 用户可尝试切到「平衡」电源模式（任务栏电池图标右键），避免「最佳性能」强制维持高频
- 别信“HTML 写法影响散热”的说法——
<div>和<section>解析耗时差不到 1ns；真正让 GC 崩溃的是你忘了在addEventListener后调removeEventListener，或者用console.log(largeObject)把整个数据结构挂进 DevTools 引用链
