VS Code 不编译 HTML5，卡顿源于配套工具链；关闭 Live Server 自动刷新、禁用冗余插件与 sourcemap、排除 node_modules 监听可显著提速。
为什么 VS Code 编译 HTML5 项目会“卡”？
VS Code 本身不编译 HTML5——它没有内置编译器。你感受到的“慢”，实际来自配套工具链：比如 vite build、webpack、esbuild 或某些 Live Server 插件的自动构建/热更新过程。真正拖节奏的是这些工具在监听文件、解析依赖、生成 sourcemap、压缩 JS/CSS 时的开销，尤其当项目含大量第三方库或未配置按需加载时。
关闭不必要的实时预览和自动构建
很多新手误以为“保存即刷新”= 快，实则反向拖慢。Live Server 插件默认启用 enableLiveReload 和 enableCustomBrowser，每次保存都触发完整页面重载；若同时开了 esbuild 的 watch 模式，两个进程争抢文件句柄，CPU 占用飙升。
- 禁用 Live Server 的自动刷新：
"liveServer.settings.donotShowInfoMsg": true+ 手动右键 →Open with Live Server后再按F5刷新 - 检查终端是否残留
vite dev或npm run dev进程，重复启动会导致监听冲突 - 删除
.vscode/settings.json中冗余项，如"emeraldwalk.runonsave"自动执行脚本（除非真需要）
vite / webpack 配置里哪些选项最影响 HTML5 构建速度？
HTML5 项目通常轻量，但若用了 Vue/React 框架或打包了大量静态资源，构建瓶颈立刻暴露。关键不是“怎么快”，而是“别做多余事”：
-
vite.config.ts中关掉非必要插件：vue()插件在纯 HTML+JS 项目里完全不用；legacy()若只支持现代浏览器，直接删 - 禁用 sourcemap：
build.sourcemap = false（开发调试时再开） - 避免
build.rollupOptions.external错误引用 CDN 资源——Vite 会仍尝试解析它们的依赖图 - Webpack 用户注意：
mode: 'development'下别开devtool: 'source-map'，改用'eval-cheap-module-source-map'
VS Code 自身设置能省多少时间？
编辑器本身不编译，但它的文件监听策略会影响底层构建工具响应速度。Windows 上尤其明显——默认监听整个工作区，哪怕你只改了一个 index.html，它也会扫描 node_modules 下百万级文件。
