开发者需要更快更小的 Tailwind class 合并方案,新引擎的构建输出在推荐配置下静默不稳定
面向 Tailwind CSS 项目的 class 合并/冲突解析新库,声明与 tailwind-merge+clsx 同 API、零依赖,并宣称常见调用快 30 倍,可通过 CLI 一键迁移。同时,用户报告其 cn build 子命令在文档推荐配置下,因生成输出文件落入扫描 glob 而被当作源文件,再次构建时结果可能静默变化。信号同时呈现开发者在 class 合并工具上对性能与精简的追求,以及新方案构建确定性上的缺口。
目标用户
使用 Tailwind CSS(含 shadcn/ui)的前端开发者与小团队,已在组件里用 cn()/twMerge() 做条件式 class 合并与冲突解析。
潜在需求
开发者需要不改动现有组件调用方式即可获得更快、更小的 class 合并实现,同时希望按文档使用 cn build 时输出保持确定性:生成的 class 表不应被反向当作源内容,进而在源码未变时静默改变构建结果。
发生场景
在 React、Vue、Svelte、Astro 等组件中,开发者通常用 clsx 做条件合并、用 tailwind-merge 解决 Tailwind 类冲突,两库叠加产生解析开销。cn 以相同 API、零依赖和宣称 30 倍速度作为替代出现,并支持改用文档推荐的 cn build 生成精简 class 表;但按该文档配置(--content 覆盖 -o 输出目录)运行时,自身生成文件会在下一次构建中被当作源扫描,扫描文件数与候选 token 显著变化且无警告。
来源证据
cn build 第二次运行时,因上次生成的输出文件已位于 --content glob 内,扫描文件数从 1 增至 2、候选 token 从 20 增至 286,源码未变但构建输入已改变。
function Button({ className }: { className?: string }) { return <button className={`rounded-md px-4 py-2 text-sm bg-primary ${className ?? ""}`} /> } EOF # Run 1 — clean tree npx cn build --content "lib/**/*.{ts,tsx}" -o lib/cn-tables.ts # → scanned 1 files, 20 candidate tokens, 5/379 class groups kept # Run 2 — unchanged source, but lib/cn-tables.ts now exists inside the glob npx cn build --content "lib/**/*.{ts,tsx}" -o lib/cn-tables.ts # → scanned 2 files, 286 candidate tokens, 5/379 classhttps://github.com/shadcn-ui/cn/issues/21
为什么值得留意
该项目由 shadcn 与 aidenybai 共同维护,瞄准组件调用最频繁的 cn(base, variant, condition && extra) 形态,并用 58 个开源仓库的真实调用做基准宣称 37× 加速;同一信号中又有用户报告新工具在推荐配置下的正确性隐患。对关注 Tailwind class 合并工具替代方向的独立开发者而言,这既是性能敏感型需求的线索,也是新方案尚未补齐的可用性缺口。
已有方案
- clsx + tailwind-merge 组合(条件合并 + 冲突解析)
- cn(同 API drop-in 替代,提供迁移 CLI)
未满足部分
- cn build 在文档推荐的 --content 包含 -o 输出目录配置下,生成文件被当作源扫描,输出与真实项目源码不一致且无警告
可能延伸 · 模型推测
- 构建工具自动排除 -o 输出文件,或检测 glob 与输出路径冲突时显式报错(推测)
- 将 cn 生成的 class 表作为缓存层与现有构建工具链集成(推测)
- 围绕 30×/37× 性能声明制作可复现的第三方基准和迁移收益对比(推测)
目前未知
- cn 的性能声明来自项目自身基准,未看到独立第三方复现
- issue 仅报告单一环境(cn 0.2.4、Node v26.8.1),无法确认影响范围
- 无法确认有多少真实项目会把 -o 放进 --content glob 的推荐模式
- cn 不支持 experimentalParseClassName 等边界 API 的实际迁移阻碍未知
继续核实
- 在典型 Tailwind 项目中,class 合并占渲染开销多大比例,30×/37× 差距是否可感知?
- cn build 的输出不确定性问题是否影响所有按文档配置的用户,官方如何修复?
- 团队从 tailwind-merge/clsx 迁移到 cn 后,在真实项目中是否遇到其他兼容性或包体问题?
- 除 356,000 差分测试外,是否有独立用户验证 cn 与 tailwind-merge 的输出一致性?