Faster product pages with two-phase data loading.
Updated
Product data is split into two endpoints for performance. Use getCore() for server-side rendering (lightweight, fast) and getOptions() for client-side hydration (variations, sizes, bundles).
Returns: name, description, images, features, Q&A, SEO, avg_rating, reviews_count, price_range, category, custom_fields. Does NOT include variations, sizes, or bulk discounts.
// Server component (page.tsx)
const { product } = await dash.products.getCore("blue-dream")
// product.name, product.description, product.main_image,
// product.price_range.min, product.avg_rating, product.reviews_count
Returns: variations with sizes and bulk discounts, related products, bundle includes, freestyle slots. Intended to be fetched client-side after SSR.
// Client component
const { options } = await dash.products.getOptions("blue-dream")
// options.variations = [{ name, slug, sizes: [{ id, label, price, stock }] }]
// options.related = [{ id, name, slug, main_image, price }]
// options.freestyle_slots = [{ id, name, max_picks, options: [...] }]
The full product endpoint returns everything in one request — but most of that data (variations, bulk discount tiers, related products) isn't needed for the initial server render. By splitting:
The original dash.products.get(slug) still works and returns everything in one call. Use it for simpler storefronts or when you don't need the performance split.
const { product } = await dash.products.get("blue-dream")
// Returns everything: variations, sizes, bundles, reviews, related, etc.