Chromatic vs Percy：2026年该选择哪款视觉测试工具？
组件视觉测试：「一种自动化验证方法，捕获隔离UI组件在不同状态下的视觉渲染，然后将这些截图与参考图进行比较，以检测其外观的任何非预期变化。」
Chromatic和Percy。两款视觉测试工具，两种哲学，两种受众。一个诞生于Storybook生态系统，只认Storybook。另一个志在通用，到处集成。两者最终都做同样的事——比较截图——但实现路径截然不同。
如果你搜索了"chromatic vs percy"，很可能你在使用Storybook，在原生方案和通用方案之间犹豫不决。这篇文章将帮助你做出决定。也许还能考虑一个两者都没有提供的选项。
Chromatic：Storybook原生工具
Chromatic由Storybook维护者亲自创建。集成完美无瑕。无需SDK，无需编写测试。有stories就有视觉测试。
优势： 与Storybook完全集成、出色的审查工作流、智能变更检测、交互式视觉测试、自动视觉文档。
劣势： Storybook二选一、成本增长快、仅限云端、无法测试完整页面。
Percy：通用方案
Percy自2020年归属BrowserStack，通过SDK与多种框架集成。
优势： 通用性、完整页面测试、通过BrowserStack的真实多浏览器渲染、Pull Request集成、响应式测试。
劣势： 逐像素比较带来更多误报、Storybook集成弱于Chromatic、浏览器倍增器导致成本上升、云端延迟。
直接对比：6个关键维度
1. 测试范围 — Percy覆盖面广，Chromatic组件深度强。 2. 采纳难度 — 有Storybook选Chromatic，没有选Percy。 3. 检测质量 — Chromatic，适度优势。 4. 协作工作流 — 取决于团队文化。 5. 多浏览器渲染 — Percy，明显优势。 6. 总成本 — 因量而异。
共同盲点：仅限云端且付费
两者都是云端方案。 2026年随着GDPR和NIS2指令，这一限制越来越难以接受。两者超出免费层后都需付费。 两者都需要技术技能。 两者都是外部依赖。
Delta-QA：本地免费替代方案
默认本地运行。 截图从不离开你的机器。免费，无附加条件。 无截图计数器。真正的无代码。 不需要Storybook，不需要SDK。完整页面和组件。 互补而非竞争。
常见问题
Chromatic能不用Storybook运行吗？
不能。专为Storybook设计。
Percy比Chromatic更好吗？
取决于场景。Storybook和组件：Chromatic。多浏览器完整页面：Percy。
Chromatic和Percy多少钱？
两者都有有限的免费层。之后按用量计费。
能同时使用吗？
技术上可以。实际上因累积成本很少这样做。
Chromatic能检测组件间的布局缺陷吗？
不能。它只测试隔离的组件。
有免费的本地替代方案吗？
有。Delta-QA是无代码本地运行的视觉测试工具，免费且无限制。
如何迁移到Delta-QA？
并行开始使用，创建首批视觉参考，评估结果。
你的视觉测试值得比截图计数器更好的方案。试试本地替代方案。