服务端渲染时内联css不应依赖html压缩器优化，而应在css生成环节压缩后注入；minifycss:true仅适用于静态、无动态插值的内联样式，且需配置level:2并禁用removeemptyattributes等危险选项。
服务端渲染时内联CSS不能靠HTML压缩“省体积”
把 <style></style> 直接写在 HTML 里，哪怕用 html-minifier-terser 开了 minifyCSS: true，也只是把 CSS 字符串变紧凑了点，但根本问题没解决：它依然阻塞渲染、无法缓存、每次 SSR 都得重新生成和传输。真正该做的，是不让 CSS 进 HTML。
常见错误现象：<style>body{margin:0;padding:0}</style> 压缩后变成 <style>body{margin:0;padding:0}</style>，体积只少几十字节，但首屏仍要等这段内联样式解析完才能 paint。
- SSR 场景下，
<style></style>内联 ≠ 性能优化，而是权衡妥协的临时方案 - 若必须内联（如 critical CSS），应单独提取、预编译、再注入，而非靠 HTML 压缩器顺带处理
-
minifyCSS: true在 SSR 中易出错：若内联 CSS 含 CSS-in-JS 注入的动态值（如color: var(--theme-color)），压缩可能破坏变量引用
html-minifier-terser 在 SSR 中启用 minifyCSS 的实操边界
不是不能开，而是得清楚它只适合「静态、已转义、无运行时插值」的内联 CSS。比如从构建时提取的 critical CSS 字符串，而非模板引擎实时拼接的结果。
典型使用场景：Next.js / Nuxt 的 getStaticProps 或 renderToString 后，对最终 HTML 字符串做一次压缩；或 Express + EJS 渲染完成后再调用 minify()。
- 必须设
minifyCSS: { level: 2 }（而非true），避免默认 level 1 对 @media 或 calc() 处理不当 - 禁用
removeEmptyAttributes：它会删掉<style data-emotion></style>中的data-emotion，导致 emotion SSR 失效 - 若用了 Tailwind 的
@layer base或 CSS nesting，确认minifyCSS支持对应语法版本（v7+ terser 默认不支持 nesting）
SSR 中真正有效的内联样式压缩路径
压缩动作不该发生在 HTML 层，而应在 CSS 生成环节。HTML 只负责安全注入——字符串越短、越干净，越不容易被误删或解析异常。
例如：Vite + Vue SSR 项目中，build.rollupOptions.output.manualChunks 提前分离 critical CSS，再通过 ssrContext.rendered 注入到 ，此时传给 html-minifier-terser 的已经是压缩过的 CSS 字符串。
- 优先用
clean-css或cssoCLI 单独压缩 CSS 文件，再读取为字符串注入 - 避免在模板里拼接样式：
<style>${theme.css}</style>→ 改为<style>${criticalCSS}</style>，其中criticalCSS是构建时确定的常量 - Webpack 用户注意：
html-webpack-plugin的minify选项在 SSR 构建中无效，它只作用于客户端 HTML 模板
容易被忽略的 SSR 渲染上下文陷阱
HTML 压缩器运行在 Node.js 环境，但 SSR 渲染器（如 React Server Components、Vue SSR）输出的 HTML 字符串可能含非 UTF-8 字节、BOM、或未转义的 Unicode 字符。这时 collapseWhitespace: true 可能意外截断或乱码。
- 确保 SSR 输出字符串编码为 UTF-8，且不含 BOM；可用
Buffer.from(html, 'utf8').toString()强制标准化 -
<pre class="brush:php;toolbar:false;"></pre>、<textarea></textarea>、<script></script>内容若来自用户输入，html-minifier-terser默认保留其空白，但若你手动启用了minifyJS: true，就可能破坏template literals中的换行 - 微信 WebView 和部分安卓系统 WebView 对
disabled这类布尔属性缩写敏感，SSR 输出的 HTML 若经压缩后变成<input disabled>，表单校验可能失效——此时宁可关掉collapseBooleanAttributes
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
