Headless Shopify is a significant technical and financial commitment. Choosing the wrong agency results in a slow Next.js app that’s harder to maintain than your Liquid theme was, or a project that stalls because the team didn’t understand Shopify’s API limitations.
Choosing the right agency delivers sub-second page loads, a flexible content architecture, and a frontend your in-house team can actually maintain. This guide gives you the framework to tell them apart.
First: Is Headless Right for Your Store?
Before evaluating agencies, confirm headless actually serves your business goals. Headless makes sense when you have:
- Traffic volume where Core Web Vital scores directly impact revenue (50,000+ monthly sessions)
- Complex content requirements that exceed Liquid’s capabilities (rich editorial, multimedia, personalisation)
- Multi-channel requirements (same content API serving web, mobile app, kiosk, etc.)
- Custom checkout experiences beyond what Shopify Checkout Extensibility supports
- A technical team capable of maintaining a React/Node infrastructure
If your store is under $5M ARR with straightforward content needs, a well-optimized custom Shopify theme will outperform a mediocre headless build. Headless amplifies good execution; it doesn’t compensate for poor execution.
Stack Evaluation: Next.js vs Hydrogen
| Criterion | Next.js + Storefront API | Shopify Hydrogen |
|---|---|---|
| Framework | Next.js (Vercel) | Remix (Shopify) |
| Shopify integration | Via Storefront API + custom hooks | Built-in hooks, components, utilities |
| Ecosystem maturity | Very large (React ecosystem) | Growing, Shopify-specific |
| Deployment | Vercel, Netlify, any Node host | Shopify Oxygen (or self-host) |
| CMS flexibility | Any headless CMS | Any headless CMS |
| Developer availability | Very high | Lower (Remix expertise required) |
| Vendor lock-in | Low (switch CMS/backend easily) | Medium (Shopify stack) |
Technical Questions to Ask Any Headless Agency
Shopify API Expertise
- “How do you handle Shopify Storefront API rate limiting and caching?”
- “How do you implement cart persistence and session management without cookies?”
- “How do you handle product variants with complex options in Next.js?”
- “Can you show me how you’ve implemented collection filtering with the Storefront API?”
- “How do you handle metafields and metaobjects in your frontend layer?”
Frontend Performance
- “What Lighthouse scores do your headless builds typically achieve on mobile?”
- “How do you handle ISR (Incremental Static Regeneration) for product and collection pages?”
- “How do you manage image optimization — next/image with Shopify CDN?”
- “Can you show a real PageSpeed Insights URL from a headless store you’ve built?”
CMS Integration
- “Which headless CMS platforms have you integrated with Shopify?”
- “How do you handle preview mode for content editors?”
- “How does your architecture handle CMS + Shopify data on the same page (e.g., editorial product pages)?”
Portfolio Evaluation for Headless Agencies
What to Look For
- Live headless Shopify stores (not demos or staging)
- PageSpeed Insights mobile scores above 80 on portfolio stores
- Evidence of CMS integration (Contentful, Sanity, Prismic)
- Complex product catalogue handling (configurable products, bundles)
- GitHub repositories or code samples (even partial)
Red Flags in Headless Agency Portfolios
- Portfolio sites have poor Core Web Vitals despite claiming to be headless (“headless” built with iframes)
- Only demo stores — no live, high-traffic production examples
- Agency presents a Shopify theme as “headless” because it uses sections/JSON
- Unable to articulate Storefront API caching strategy
- No mention of ISR, SSG, or edge rendering — suggesting server-rendered pages that don’t scale
- They recommend headless for a 500-SKU store with basic content needs
Pricing Reality Check
Understand what you’re paying for in headless versus traditional Shopify development:
- Custom Shopify theme: $15,000–$40,000 — lower build cost, simpler maintenance, merchant-editable via Shopify admin
- Headless (Next.js + Storefront API): $40,000–$150,000+ — higher build cost, more complex maintenance, developer-required for many changes
- Headless ongoing maintenance: $3,000–$10,000/month for an agency retainer; $8,000–$15,000/month for a FTE frontend developer
Factor in the ongoing cost. Headless isn’t “build once and forget.” It requires regular dependency updates, performance monitoring, and feature development that a standard Shopify theme doesn’t require.
Contract and Delivery Considerations
- Require performance SLAs in the contract (e.g., LCP < 2.5s on mobile, Lighthouse ≥ 80)
- Ensure IP transfer covers all custom code and configuration
- Request code handoff with documentation — you must be able to hire another developer to continue the project
- Confirm deployment infrastructure setup is included (Vercel/Netlify config, CI/CD pipeline)
- Require a knowledge transfer session with your internal team before final payment
Frequently Asked Questions
A headless Shopify agency builds the custom frontend (typically Next.js or Hydrogen) that connects to Shopify’s Storefront API as the backend. They handle React development, SSR/ISR performance, Shopify API integration, CMS setup, and ongoing frontend maintenance.
Probe their real Shopify and frontend depth: how they handle the Storefront API and cart/checkout (checkout stays on Shopify — can they explain why), how they manage caching and SSR/ISR for fast Core Web Vitals, how they connect a headless CMS for editable content, and how they handle SEO (server-rendering, metadata, redirects, structured data). Ask for a real Lighthouse score on a site they shipped, not a demo. Vague answers on caching, SEO, or checkout are the clearest reason to walk away.
Watch for: no live headless sites in the portfolio (only standard themes), inability to show real performance numbers, treating SEO as an afterthought, no clear plan for editable content via a CMS, and proposing headless when your store doesn’t actually need it. Other warnings: hand-wavy answers about checkout, no staging or QA process, and pricing far below market — headless is expensive to do well, and a cut-rate quote usually means a hard-to-maintain build.
Both are valid. Next.js is more flexible, has a larger ecosystem, and is familiar to most React teams. Shopify Hydrogen (built on Remix) has tighter Shopify integration with purpose-built hooks and components but ties you more closely to Shopify’s stack. For most brands, Next.js offers more long-term flexibility.
No — the Shopify Storefront API is available on all plans. However, Shopify Plus provides additional headless capabilities: checkout extensibility, multipass login, B2B APIs, and dedicated account management. Most high-revenue headless brands are on Plus.
A skilled freelancer can work for a focused, well-scoped headless project if they have proven Shopify + Next.js/Hydrogen work and you can manage them. For most builds, an agency is safer: headless spans frontend, Shopify backend, CMS, DevOps, and SEO, which is a lot for one person to own and support long-term. Agencies also give continuity if someone leaves. Match the choice to scope and your own ability to manage the work.
Most headless Shopify builds run roughly 2–4 months to launch, depending on the number of templates, integrations (CMS, search, reviews, subscriptions), and how much custom UX is involved. A focused Hydrogen storefront with few integrations can be faster; a complex Shopify Plus build with bespoke functionality takes longer. Budget extra time for performance tuning, SEO and redirect setup, and QA — that’s where headless timelines most often slip.
Headless Shopify projects typically start at $30,000–$50,000 for a well-scoped frontend build, and can reach $100,000–$300,000+ for complex implementations with custom CMS, internationalisation, and integrations. Ongoing maintenance runs $3,000–$10,000/month.
Related Resources
Our Headless Shopify Service
Next.js + Storefront API builds with proven performance results.
Learn MoreShopify Plus Development
Shopify Plus features that pair well with headless architecture.
Learn More