Shopify 强制迁移结账扩展至 Preact 与 Polaris Web 组件，包体积最高缩减 85%

一句话结论

Shopify 强制结账扩展从 React 迁移至 Preact 与 Polaris Web 组件，2026 年 10 月 1 日起旧版本将被阻断部署，包体积最高缩减 85%。

关键要点

• Shopify 将五个高流量结账 UI 扩展从 React 和 Remote UI 桥接迁移至基于 Preact 和 Polaris Web Components 的 remote-dom 架构，覆盖约三分之一定制结账页面的渲染。
• 所有扩展的传输包体积下降幅度在 40% 至 85% 之间，其中 payment-icons 扩展缩减了 84.4%，包体积上限从 100KB 至 112KB 压缩至 64KB。
• 从 React 切换到 Preact 并移除 react-reconciler 节省了约 89KB；内部 Liquid 解析器 “droplet” 压缩后仅 13KB，替换了约 73KB 的 liquidjs。
• 扩展加载时间中位数下降约 8%，90 百分位值下降 7%，该数据按结账量加权计算。
• 2026 年 10 月 1 日起，若应用部署包含早于 2026-01 的扩展版本将被阻止，API 版本从 2025-07 升级至 2026-01。

背景与事实

Shopify 作为一个为数百万在线商店提供支持的商务平台，其 Checkout Blocks 应用用于无代码定制结账流程。2025 年底，Shopify 在 API 2025-10 版本中首次引入了转向 Preact 和框架无关 Web Components 的方案，该架构基于 Polaris 设计系统，使自定义元素不再依赖特定框架，无论开发者使用何种技术栈都能渲染相同的 UI。早期反馈整体偏正面，开发平台 Gadget 称这一转变是“很棒的更新”，指出 Preact 以极小的运行时提供了类似 React 的体验。

在技术实现细节上，团队用内部代号为 “droplet” 的 Liquid 解析器替换了 liquidjs，并基于来自真实商家配置的 42000 行对照语料完成兼容性校验。dayjs 被一个小的自定义日期工具替换，而 markdown-to-jsx 予以保留，做了 Preact 别名映射而非直接替换。remote-dom CLI 在 2026-01 版本中强制规定每个扩展压缩后包体积上限为 64KB，而此前的包大小约为 100KB 到 112KB。

影响分析

对中文开发者与从业者而言，此次迁移带来两方面直接影响。一方面，包体积的显著缩减意味着更快的加载速度，对依赖结账体验转化率的电商商家是利好；另一方面，2026 年 10 月 1 日的强制阻断政策要求所有开发者必须完成迁移，否则应用将被阻止部署。这迫使开发团队需要学习 Preact 与框架无关 Web Components 的开发模式，而非继续依赖 React 生态。Shopify 提供了升级指南和 AI 工具包，以及 Checkout 和 Customer Account 扩展的迁移指南，以辅助完成过渡。

适用边界

此结论主要适用于 Shopify 生态内的结账扩展开发者。对于未使用 Shopify 平台、或仅使用非结账类扩展的开发者，此次迁移不直接适用。此外，若开发者已使用框架无关的自定义元素架构，则无需进行 Preact 切换，但仍需关注 64KB 包体积上限的新约束。

孤本观察

值得注意的是，时隔一年后社区评价变得褒贬不一：2026 年 4 月有开发者在 Shopify 论坛提出“交付一个无法固定版本的 CDN 脚本对稳定性来说是一场噩梦”，该诉求在 2026 年年中仍在持续讨论；同时有开发者指责新组件“不完整”，列举了缺少 Polaris React 提供的 Index Table 等组件。这反映出强制迁移在提升性能的同时，也在组件完整性和版本稳定性方面引入了新的技术债务与社区摩擦。

来源：InfoQ 中文 AI