Hyva vs Luma: A Practitioner’s Comparison of Magento 2 Frontend Performance

What is the difference between Hyva and Luma in Magento 2?

Luma is the default frontend theme Magento 2 has shipped since 2015. It runs on KnockoutJS, RequireJS, jQuery, and LESS CSS. Hyva, created by Willem Wigman and launched in 2021, replaces that entire stack with Alpine.js and Tailwind CSS. The result is a frontend that ships a fraction of the JavaScript, renders faster on mobile, and gives developers a build environment that does not require fighting Magento’s legacy module system. For most mid-market US merchants still on Luma in 2026, the question is no longer whether to migrate. It is when, how, and what it will cost. Bemeir’s Magento development practice has guided merchants through this decision across dozens of engagements.

The tech stack: Alpine.js and Tailwind CSS vs KnockoutJS and RequireJS

Luma’s architecture was designed for a desktop-first web in 2015. KnockoutJS handles two-way data binding on the product detail page and cart. RequireJS loads JavaScript modules asynchronously, but the dependency graph grows large fast. jQuery underpins most UI interactions. LESS CSS compiles into stylesheets that ship whether the page uses those rules or not. The result, according to Hyva.io, is a standard Luma page loading 200+ JS and CSS resources totaling 1.5 MB. Hyva loads two resources at 0.2 MB, a 98% reduction in page requests and an 86% reduction in page weight.

Hyva replaces KnockoutJS with Alpine.js, a 15 KB reactive library that handles the same UI interactions with far less overhead. Tailwind CSS replaces LESS, and unused utility classes are purged at build time, so the CSS payload stays minimal. Magewire, Hyva’s server-driven component layer, handles more complex interactivity without shipping heavy client-side JavaScript. The setup:static-content:deploy step runs faster, CI/CD pipelines are simpler, and developers who know modern HTML and CSS can contribute without learning Magento’s legacy XML layout system.

According to IWD Agency, Luma ships 700 KB to 1.2 MB of JavaScript on a typical product detail page. Hyva ships 50 to 100 KB. That is roughly a 10x reduction in JavaScript execution time before any other optimization is applied.

Hyva vs Luma performance: PageSpeed scores and Core Web Vitals

Hyva is substantially faster than Luma in every controlled test and in real-world CrUX field data. The performance gap is not marginal.

According to Sigma Infosolutions, stores running Luma frequently score between 30 and 60 on Google PageSpeed Insights. Hyva stores typically score 85 to 98. Navigate Commerce’s comparison testing found real-world stores jumping from the 20 to 40 range to 90+ after migration.

The gap is wider on mobile, where Google’s mobile-first indexing makes it count most. TechBuzzIreland’s analysis found Hyva LCP on mobile typically stays between 1.2 and 1.8 seconds. Luma pages on mobile can reach 3.5 to 5 seconds or more. Eltrino’s controlled WebPageTest on an iPhone X showed a category page loading in 1.6 seconds on Hyva versus 8 seconds on Luma. Product page weight in that same test was 0.15 MB on Hyva versus 0.9 MB on Luma, making Luma’s pages 4 to 5 times heavier.

Core Web Vitals: where Luma fails and Hyva passes

Google’s Core Web Vitals measure Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), Interaction to Next Paint (INP), and Total Blocking Time (TBT). First Contentful Paint (FCP) and the older First Input Delay (FID) are also tracked in Lighthouse and CrUX.

Luma has a specific problem with CLS. IWD Agency’s testing found that KnockoutJS-driven layout shifts on Luma pages consistently push CLS past the 0.1 threshold that triggers a “Poor” classification in CrUX field data. KnockoutJS renders content client-side after page load, so elements shift as they appear. Hyva renders more content server-side, and Alpine.js handles interactions without the same layout thrashing.

At the population level, the CrUX data is clear. According to MageDelight, citing HTTP Archive data from November 2025, 65% of live Hyva-based Magento stores pass Google’s Core Web Vitals assessment. Only 41% of stores running the standard Luma frontend pass. That 24-point gap in pass rate has direct implications for Google’s Page Experience signal and organic rankings.

One honest caveat: RUMvision’s CEO, writing on the Hyva.io blog, notes that about half of websites using Hyva still struggle with Core Web Vitals in field data. The culprit is almost always third-party scripts and additional coding choices layered on top of Hyva, not the theme itself. Hyva gives you a clean starting point. Keeping it clean through the build requires discipline and a team that knows what it is doing.

What the performance gap means for revenue

The conversion math is well established. Research cited by Sigma Infosolutions shows a one-second delay in page load reduces conversions by 7%. Deloitte research cited by MageDelight found that a 0.1-second improvement in load time increases ecommerce conversions by 8.4%.

Bemeir’s own data across Hyva engagements sharpens this further. In our composite case study, mobile sessions with LCP under 2.5 seconds converted at roughly 1.7 times the rate of sessions over 4 seconds. Bounce rate on slow sessions was 60% higher. Those are not hypothetical numbers. They are session-level analytics from a real store before and after migration. Bemeir’s experience across Hyva engagements has consistently shown 3x to 5x improvements on mobile Core Web Vitals when the migration is executed correctly.

The real-world case studies from the broader Hyva ecosystem are consistent. According to Navigate Commerce, NetworkStore.ro saw page load times decrease by 80%, session duration increase by 30%, and conversion rates increase by 25% within the first month after migration. The Hyva.io Agency Showcase documents Rimpler Cosmetics achieving a 141% revenue increase, 43% higher conversion rates, and a 67% improvement in page speed, winning the HIVE Awards 2025 Best Conversion Improvement category. ProCase’s migration in November 2024 produced a 5% revenue increase, 5% more orders, and a 7.6% growth in customer base in the first year.

Hyva vs Luma: side-by-side comparison

Extension compatibility: what breaks and what does not

This is where most migration projects get scoped incorrectly. Hyva does not use KnockoutJS or RequireJS, so any Magento extension that renders frontend UI through those systems will not work on Hyva without modification.

According to Hyva.io, over 1,680 Magento 2 extensions are now compatible with Hyva. That number has grown steadily since the theme launched. Major extension vendors including Amasty, Mageworx, Aheadworks, and Mirasvit have all produced Hyva-compatible versions of their most popular modules. Payment integrations including Klarna, Stripe, and Mollie have Hyva support. Algolia’s search module and Meilisearch both have Hyva-compatible implementations. ShipperHQ and Yotpo have Hyva compatibility as well.

The Hyva Compatibility Module Tracker, maintained at hyva.io, is the authoritative list. Before any migration scoping, every extension in the store’s composer.json needs to be checked against it.

Extensions fall into three practical tiers:

Tier 1: Already compatible. The vendor ships a Hyva module or a Hyva compatibility module alongside the standard extension. Drop it in, configure it, done.

Tier 2: Needs a Hyva compat module. The extension has backend logic that works fine, but the frontend templates need to be rewritten for Alpine.js and Tailwind. A Hyva compat module pattern handles this: a separate module that overrides only the frontend templates while leaving the backend untouched. This is standard work for a Hyva-experienced team.

Tier 3: Incompatible or requires significant rework. Custom modules built entirely on KnockoutJS, or extensions with no Hyva version and no compat module available, need to be rebuilt or replaced. This is where migration timelines stretch and budgets expand if the audit is not done upfront.

Bemeir runs a full module compatibility audit before scoping any Hyva migration. Every extension gets a tier classification, a remediation estimate, and a replacement recommendation where applicable. Skipping this step is the single most common reason Luma-to-Hyva projects run over budget. The complete Luma to Hyva migration playbook covers how this audit feeds into fixed-scope project delivery.

Hyva for B2B Adobe Commerce: the section most agency articles skip

Most Hyva comparison articles treat the migration decision as a B2C problem. It is not. A significant share of Magento and Adobe Commerce deployments in the US are B2B, and B2B introduces complexity that requires specific Hyva expertise.

Adobe Commerce B2B features include Company Accounts, Shared Catalogs, negotiated pricing, purchase orders, requisition lists, and quote workflows. These features have their own frontend templates. Multi-Store Inventory (MSI) affects how product availability is displayed. ERP integrations, CRM connections, and POS systems often write to or read from the Magento database in ways that affect what the frontend needs to render.

Hyva supports Adobe Commerce B2B. The Hyva Compatibility Layer provides a path for B2B-specific frontend components. But the implementation is not automatic. Shared Catalogs require that the Hyva theme correctly resolves which catalog a logged-in company account should see. Company Accounts login flows need to be rebuilt in Alpine.js. Quote and purchase order workflows have multi-step UI that needs careful porting. ERP sync processes that trigger frontend cache invalidation need to be tested against Hyva’s different static content deployment model.

Barr Display is a documented example of a B2B Hyva deployment. The complexity of B2B Hyva work is why Bemeir’s 10+ years of B2B Magento experience matters here. We have scoped and shipped B2B Hyva builds where the extension audit alone identified seven modules requiring compat modules, two requiring full rewrites, and one requiring replacement with a Hyva-native alternative.

If your store uses Adobe Commerce B2B and you are evaluating a Hyva migration, the module audit needs to explicitly cover every B2B feature your buyers use. A team that has only done B2C Hyva migrations will miss these edge cases.

If you are running B2B on Adobe Commerce and want a scoped migration plan, Bemeir’s Hyva development services cover the full B2B surface.

Hyva Checkout: a standalone upgrade option

Hyva Checkout is a separate product from the Hyva theme. It replaces Magento’s standard checkout with a faster, Alpine.js-based checkout that can be deployed independently, meaning a store can run the standard Luma theme and still get a significantly better checkout experience without a full frontend migration.

This matters because checkout is where conversion rate improvements are most directly measurable. According to Magebit’s reporting from the HIVE event, Joma Jewellery and Katie Loxton saw a 15% conversion rate increase after migrating to Hyva Checkout, with gains visible during Black Friday 2024.

For merchants who cannot absorb a full 14-week Hyva theme migration right now, Hyva Checkout is a legitimate intermediate step. It de-risks the conversion impact of the full migration and gives the team real Hyva experience before the larger project.

Hyva vs headless: which one is right for your store?

This is the question ecommerce directors at mid-market US stores ask most often, and the answer is almost always Hyva.

Headless architectures, typically built on Next.js or Remix with PWA Studio or a custom GraphQL layer, deliver comparable or slightly better raw performance numbers than Hyva on high-traffic stores with very specific frontend requirements. The trade-off is cost and complexity. According to IWD Agency, a typical Luma-to-Hyva migration costs $35,000 to $80,000. A headless PWA build costs $90,000 to $250,000. Bemeir’s own composite case study found the headless rebuild cost for a comparable Magento store was 3 to 4 times higher than a Hyva theme rebuild, with marginal performance gains for that brand’s actual traffic patterns.

Headless also fragments your stack. The Magento backend handles catalog, orders, and business logic. A separate Node.js application handles the frontend. Two deployment pipelines, two sets of developers, two failure surfaces. Every Magento upgrade needs to be tested against the frontend application. Every extension that touches the GraphQL API needs to be verified. The operational overhead is real.

Hyva delivers roughly 80% of the performance gains of headless at roughly 30% of the cost, while keeping the stack unified and the Magento admin intact. For a US mid-market merchant running $5M to $50M in annual GMV on Magento or Adobe Commerce, that trade-off is straightforward in most cases.

The cases where headless makes sense: stores with very high traffic (millions of sessions per month), teams with dedicated frontend engineers who own a separate React or Vue application, or brands that need a mobile app and a web frontend sharing the same API layer. For everyone else, Hyva is the right answer. Merchants evaluating alternatives beyond Magento entirely can review Bemeir’s Shopify development services and BigCommerce development services to understand where those platforms fit relative to a Hyva-powered Magento build.

Hyva migration cost and timeline: what to expect

Migration scope drives cost and timeline more than any other variable. A store with 12 extensions, a standard B2C catalog, and no custom checkout modifications can migrate to Hyva in 4 to 6 weeks. A store with 35 extensions, custom B2B workflows, an ERP integration that touches frontend rendering, and a heavily customized Luma child theme can take 14 to 16 weeks.

Bemeir’s standard migration process:

1. Module compatibility audit. Every extension classified into the three tiers described above. This takes one to two weeks and produces a fixed scope document.
2. Hyva theme setup and design system. Tailwind configuration, typography, color tokens, and component library built to match the brand. Run in parallel with compat module development.
3. Compat module development. Tier 2 extensions get Hyva frontend templates. Tier 3 extensions get replaced or rebuilt.
4. Page template migration. Home page, category pages, product detail pages, CMS pages, and account pages rebuilt in Hyva’s Alpine.js and Magewire patterns.
5. Checkout migration. Either Hyva Checkout or a ported version of the existing checkout flow.
6. QA and performance validation. Lighthouse, PageSpeed Insights, and CrUX monitoring against baseline. Core Web Vitals sign-off before launch.
7. Blue/green deployment. The Hyva build goes live on a staging environment with production traffic mirrored, then cutover with rollback available.

The revenue-payback model is straightforward. Take your current monthly revenue, apply the conversion rate improvement from the performance data (conservative: 15% to 25% for a store moving from sub-50 PageSpeed to 90+), and divide the migration cost by the monthly revenue uplift. Most mid-market US stores see payback inside 6 to 9 months.

The open-source licensing change: what it means for your TCO

In November 2025, Hyva went fully open source under the OSL3 and AFL3 licenses. According to MageDelight, the previous EUR 1,000 per year license fee for the core theme is eliminated. This changes the total cost of ownership calculation for any merchant who had been factoring the license cost into their migration decision.

The core theme is now free. Hyva Checkout, Hyva Enterprise, and Hyva Commerce remain commercial products. The open-source change also means the Hyva ecosystem will grow faster, as more developers can contribute without a commercial license gate.

For US merchants who were waiting on the licensing question, that reason to delay is gone.

Hyva vs Luma: the decision framework for US mid-market merchants

The comparison is not really about which theme is faster. Both themes run on the same Magento backend. The real question is whether the performance delta translates to enough revenue to justify the migration investment, and whether the migration can be executed without disrupting live commerce.

Here is how to think through it:

Migrate to Hyva if:
– Your Google PageSpeed score on mobile is below 60.
– Your LCP on mobile is above 2.5 seconds in CrUX field data.
– Your store is failing Core Web Vitals in the Google Search Console Page Experience report.
– You are running paid search and your landing page Quality Score is being dragged down by slow load times.
– You have a B2B store on Adobe Commerce where buyer experience on mobile is poor.
– You are planning a major redesign and want to build on a modern stack.

Consider staying on Luma (for now) if:
– Your store is on Magento 2.3 or earlier and needs a platform upgrade first. Migrate the platform, then migrate the frontend.
– Your extension stack is 80% Tier 3 and the rebuild cost approaches headless territory. Re-evaluate the build vs. replace decision.
– You are 3 to 6 months from a full platform replatform to Shopify Plus or BigCommerce. A Hyva migration does not make sense as a short-term investment in that scenario.

Consider Hyva Checkout as an intermediate step if:
– Your theme migration is 6+ months out but checkout performance is the most urgent conversion problem.

Bemeir has been the USA’s first and only Gold Hyva Partner since the program launched. We have a direct line to the Hyva team, which means we see the roadmap, can escalate compatibility issues, and can access support that Silver Partners and non-partners cannot. If you are scoping a Hyva migration and want an honest module audit and a fixed-scope proposal, talk to the Bemeir team.

Developer experience: why Hyva builds ship faster

The developer experience improvement is a real cost factor, not just a quality-of-life point. According to Elightwalk, many agencies report development is 50 to 70% faster with Hyva than with Luma. Hyva.io’s own documentation cites 20 to 50% development time savings compared to building on the Magento 2 default stack.

The reasons are structural. Tailwind CSS with PurgeCSS eliminates the LESS compilation and override chain that makes Luma child theme development slow. Alpine.js components are self-contained and testable without the RequireJS dependency graph. Magewire components can be built and tested server-side without a full frontend compilation cycle. The setup:static-content:deploy step runs faster because the asset footprint is smaller.

For a US agency billing at $150 to $200 per hour, a 30% reduction in development hours on a $60,000 migration is $18,000 in either cost savings passed to the client or margin retained by the agency. It also means faster iteration during QA and lower cost for post-launch feature work.

Hyva’s product ecosystem: Hyva UI, Hyva Enterprise, and Hyva Commerce

Hyva is not a single product. Willem Wigman and the Hyva team have built an ecosystem around the core theme.

Hyva UI is a component library for the Hyva theme, providing pre-built Alpine.js and Tailwind components for common ecommerce UI patterns.

Hyva Checkout is the standalone checkout replacement described above.

Hyva Enterprise and Hyva Commerce are commercial tiers that add features for larger deployments, including additional support and enterprise-specific components.

Magewire is Hyva’s server-driven component framework, comparable in concept to Laravel Livewire. It allows developers to build interactive frontend components without writing JavaScript, using PHP and server-side rendering instead. For teams with strong Magento PHP skills but limited JavaScript experience, Magewire significantly reduces the learning curve.

The Hyva Compatibility Layer is the mechanism that allows existing Magento modules to work alongside Hyva without a full rewrite. It provides a fallback rendering path for modules that have not yet been ported to Alpine.js templates.

Frequently asked questions

What is the difference between Hyva and Luma in Magento 2?
Luma is Magento 2’s default frontend theme, built on KnockoutJS, RequireJS, jQuery, and LESS CSS. Hyva is a modern replacement built on Alpine.js and Tailwind CSS. Hyva ships roughly 10x less JavaScript, loads significantly faster on mobile, and passes Google’s Core Web Vitals at a much higher rate than Luma.

Is Hyva faster than Luma for Magento stores?
Yes, substantially. Hyva stores typically score 85 to 98 on Google PageSpeed Insights. Luma stores typically score 30 to 60. Mobile LCP on Hyva averages 1.2 to 1.8 seconds; on Luma it frequently reaches 3.5 to 5 seconds or more. In controlled testing, a category page on an iPhone X loaded in 1.6 seconds on Hyva versus 8 seconds on Luma.

How much does it cost to migrate from Luma to Hyva?
A typical Luma-to-Hyva migration costs $35,000 to $80,000, depending on the number of extensions, the degree of customization, and whether B2B features are involved. This compares to $90,000 to $250,000 for a headless PWA rebuild delivering similar performance outcomes.

How long does a Luma to Hyva migration take?
Four to six weeks for a straightforward B2C store with a small extension stack. Twelve to sixteen weeks for a complex store with many custom extensions, B2B Adobe Commerce features, or heavily customized templates. The module compatibility audit, run before scoping, determines the timeline.

Does Hyva work with all Magento extensions?
No. Over 1,680 Magento 2 extensions are now compatible with Hyva, but not all extensions have been ported. Extensions that render frontend UI through KnockoutJS or RequireJS need either a vendor-supplied Hyva compatibility module or custom development to rebuild their frontend templates. A pre-migration audit classifies every extension in the store.

Is Hyva compatible with Adobe Commerce B2B features?
Yes, with proper scoping. Company Accounts, Shared Catalogs, purchase orders, and quote workflows all have Hyva-compatible implementations, but they require specific development work. B2B Hyva migrations need a team with direct experience porting these features, not just B2C Hyva experience.

What PageSpeed score can I expect after migrating to Hyva?
Most stores reach 85 to 98 on Google PageSpeed Insights after a well-executed Hyva migration. Reaching and maintaining that range requires discipline around third-party scripts and image optimization. Stores that pile third-party tag manager scripts and unoptimized images back onto the Hyva theme will see scores fall. The theme gives you the foundation; the build choices determine the final number.

Should I use Hyva or go headless for my Magento store?
For most US mid-market merchants, Hyva is the right choice. It delivers roughly 80% of the performance gains of headless at roughly 30% of the cost, while keeping the Magento stack unified. Headless makes sense for very high-traffic stores with dedicated frontend engineering teams and specific requirements that Hyva cannot meet.

What is Hyva Checkout and do I need it?
Hyva Checkout is a standalone replacement for Magento’s standard checkout, built on Alpine.js. It can be deployed without migrating the full theme. Joma Jewellery and Katie Loxton saw a 15% conversion rate increase after deploying Hyva Checkout. It is a legitimate intermediate step for stores where checkout performance is the most urgent problem.

Does Hyva improve Google Core Web Vitals rankings?
Yes, in aggregate. 65% of Hyva-based stores pass Google’s Core Web Vitals assessment versus 41% of Luma stores, based on HTTP Archive data from November 2025. Core Web Vitals are a component of Google’s Page Experience signal, which factors into organic rankings. Faster LCP, lower CLS, and reduced TBT all contribute to passing the assessment.

Is Hyva now free or does it still require a license?
The Hyva core theme went fully open source under OSL3 and AFL3 licenses in November 2025. The previous EUR 1,000 per year license fee is eliminated. Hyva Checkout and the commercial Hyva Enterprise and Hyva Commerce tiers remain paid products.

What happens to my custom Luma modules when I migrate to Hyva?
Custom modules with frontend UI components need their templates rewritten for Alpine.js and Tailwind CSS. Backend logic, admin UI, and data models are unaffected. The scope of this work depends on how much custom frontend code the modules contain. A module compatibility audit quantifies this before the project starts.

What is the ROI of a Hyva migration?
The payback period depends on the migration cost and the revenue uplift from improved conversion rates. Bemeir’s composite case study data shows sessions with LCP under 2.5 seconds converting at 1.7x the rate of sessions over 4 seconds. For a $10M annual revenue store moving from a 1.5% to a 2% conversion rate on mobile, the monthly revenue uplift exceeds $40,000. Most mid-market stores see migration payback inside 6 to 9 months.

Can I run Hyva on Magento Open Source or only Adobe Commerce?
Hyva runs on both Magento Open Source and Adobe Commerce. The B2B-specific features (Shared Catalogs, Company Accounts, purchase orders) require Adobe Commerce B2B, as they do with Luma. The core Hyva theme and Hyva Checkout work on Magento Open Source.

What is the Hyva Compatibility Layer and when do I need it?
The Hyva Compatibility Layer is a mechanism that allows certain Magento modules to render on a Hyva store without a full frontend port. It provides a fallback rendering path using the module’s existing templates. You need it when a module has no Hyva-native version and no compat module available, and the module’s frontend output is needed on the Hyva store. It is a bridge, not a permanent solution. Modules using the compatibility layer do not get the full performance benefit of native Hyva templates.

Related Resources

• Luma to Hyva migration: the complete playbook for Magento 2 (timeline, cost, Core Web Vitals)
• Hyva development services
• Magento development services
• Bemeir technology partners
• About Bemeir
• BigCommerce development