vs code 中 html 高亮卡顿应禁用冗余插件、关闭语义高亮、优化内联 js，并确保 codemirror 主题同步修改 codemirror.css 和 theme.css，覆盖所有 token 选择器及 css 变量继承链。
Prettify 和 Highlight.js 是网页端嵌入式高亮最稳的两个选择，但它们不解决编辑器内部实时高亮问题；VS Code 里真正管用的不是“插件名”，而是语言服务 + 主题 CSS 的组合配置——装错东西反而拖慢输入。
VS Code 里 HTML 高亮卡顿，别乱装高亮插件
HTML 文件本身不需要额外高亮插件：VS Code 自带的 html 语言模式已内置 tokenization（词法分析），加装 Prettify、Auto Rename Tag 或 ESLint 反而会触发重复解析，尤其在含内联 <script></script> 的页面中，光标移动延迟明显。
- 禁用
Auto Rename Tag：它对每个标签做 DOM 树比对，大文件下 CPU 占用飙升 - 关掉
html.suggest.html5（settings.json 中设为false）：若项目不依赖 HTML5 新标签，省去大量 schema 加载 - 把超过 20 行的内联 JS 移到外部文件，或临时用
<script type="text/plain"></script>包裹，让编辑器跳过语法扫描 - 禁用
editor.semanticHighlighting.enabled：HTML 场景下语义高亮收益极低，却强制启动 TypeScript 语言服务
CodeMirror 类编辑器必须改双层 CSS 文件
自建或嵌入的 CodeMirror 编辑器（如文档站、CMS 后台代码块）主题失效，90% 是因为只改了 theme.css 却漏掉 codemirror.css。这两者是叠加生效的：codemirror.css 提供基础布局和默认色值，theme.css 覆盖 token 样式，缺一不可。
- 必须同步修改的选择器包括：
.cm-s-default .cm-tag（标签名）、.cm-s-default .cm-attribute（属性名）、.cm-s-default .cm-string（字符串）、.cm-s-default .cm-matchhighlight（搜索高亮） - 深色主题下
.cm-string别用#ce9178（低对比度橙红），换成#d7ba7d更易读 -
.cm-matchhighlight默认背景太淡（如background: #007acc20），得加!important改成background: #3a3a3a - 别信“一键切换”主题插件——它们几乎从不碰
codemirror.css，导致高亮层和 toolbar 按钮颜色不一致
用 CSS 变量切主题？先确认编辑器是否支持
VS Code、Brackets 等桌面编辑器不认纯 CSS 变量；它们的主题系统基于 JSON 配置 + 硬编码 CSS 类名。只有你自己写的 Web 端编辑器（如用 Tiptap/Quill 构建）才适合用 :root 变量驱动主题切换，但要注意三件事：
-
contenteditable元素不会自动继承color和background，必须显式写color: var(--text-primary); background: var(--bg-editor); - 光标颜色靠
caret-color: var(--text-primary)单独控制，不能省略 - 第三方代码块（如
<pre class="brush:php;toolbar:false;"><code class="html"></code>）里的高亮样式通常由 Prism/Highlight.js 控制，需单独接入变量体系，否则切主题后代码块还是老样子</pre> - 动态
document.documentElement.style.setProperty()会引发重绘抖动，推荐用document.documentElement.className = 'theme-dark'切换
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
