Storefront API 多个查询能不能合并成一次请求
现象#
首页需要轮播、热销、新品三组数据,发了三个请求,首屏等待时间叠加。
原因#
- 每次只查一个资源,网络往返开销大
- 未使用 GraphQL 别名在同一请求里并行取多组数据
处理步骤#
- 用别名合并:
{ featured: products(first: 8, query: "tag:featured") {...} newArrivals: products(first: 8, sortKey: CREATED_AT, reverse: true) {...} } - 注意总 cost 不超过限制,必要时拆成两次
- 配合
@inContext统一国家与语言 - 在服务端或构建时预取,前端直接用水合数据
验收标准#
首屏数据请求数减少到 1-2 个,加载时间明显下降,各组数据正确对应。
本文由 风格技术 技术团队整理,适用于 Shopify 标准版与 Plus 店铺。Shopify 平台能力迭代较快,具体操作路径与字段以官方文档和店铺后台实际版本为准。