How to auto-switch to the next available variant when a product has 2048 variants but storefront only exposes 250?
Question / Description
Shopify now supports up to 2048 variants per product, but I’m running into a limitation on the storefront side and would like to understand the recommended approach.
Problem
On the storefront:
-
product.variantsin Liquid only returns the first ~250 variants -
/products/{handle}.jsonalso returns only the first 250 variants -
Even when using pagination, the Storefront API only exposes the first 250 variants, so it’s not possible to retrieve all 2048 variants by making multiple calls.
This means variants outside the first 250 are completely inaccessible from Liquid or frontend JS.
Use case (important)
I need to implement the following behavior:
-
When a user selects a sold-out (unavailable) variant, the product should automatically shift to the next available (in-stock) variant
-
The “next available” variant:
-
May exist outside the first 250 variants
-
Should be determined in a circular manner
- If the selected variant is the last variant, it should loop back and return the first available variant
-
-
This logic cannot be limited to the first 250 variants
In short, I need a reliable way to determine the next available variant across all 2048 variants, not just the subset exposed on the storefront.
Constraints
-
This needs to work for products with hundreds or thousands of variants
-
Making multiple storefront calls does not help, since variants beyond 250 are not accessible at all
-
Fetching and iterating through all variants on the front-end is not possible