• Support
  • System Status
  • App Store
  • Frontend Agents
  • Merch
  • Academy
laioutr-logo-purple.svg
LoginGet started
  • Blog
  • What Is a Magento Frontend? Luma, Hyvä, PWA Studio, Headless and FMP Explained
Hero bf magento frontend en

What Is a Magento Frontend? Luma, Hyvä, PWA Studio, Headless and FMP Explained

  1. 1.What is a Magento frontend, and why does the choice matter now?
  2. 2.The five frontend options at a glance
  3. 3.Comparison: trade-offs at a glance
  4. 4.When you should decouple the frontend from the backend
  5. 5.FAQ
  6. 6.More from the Laioutr Platform
  7. 7.Next step
  1. 1.What is a Magento frontend, and why does the choice matter now?
  2. 2.The five frontend options at a glance
  3. 3.Comparison: trade-offs at a glance
  4. 4.When you should decouple the frontend from the backend
  5. 5.FAQ
  6. 6.More from the Laioutr Platform
  7. 7.Next step

What Is a Magento Frontend? Luma, Hyvä, PWA Studio, Headless and FMP Explained

If you run Adobe Commerce or Magento 2, the hardest decision rarely sits in the backend. The catalog, the cart, the pricing logic, and the checkout are settled. The real question is: what do we render the storefront with, the part your customers actually see? That is the Magento frontend, and today there is more than one answer. This piece maps the five common options, Luma, Hyvä, PWA Studio, a fully headless setup, and a Frontend Management Platform (FMP), shows the trade-offs, and explains when decoupling from the backend pays off.

What is a Magento frontend, and why does the choice matter now?

A Magento setup has two halves. The backend is the commerce engine: product data, cart, pricing, promotions, taxes, orders. The frontend is the presentation layer: the pages, templates, and interactions that reach the browser. In a classic Magento build, the two halves are tightly wired together. The frontend renders server-side from PHP templates that live in the same application stack as the business logic.

That coupling was the default for a long time, but it has consequences. Load times, developer experience, and the speed at which your team ships new pages and campaigns depend almost entirely on this layer. Since Magento 2, several ways to build the frontend differently have emerged, some still coupled, some fully decoupled. The choice determines how fast your storefront is, how comfortable your team is working in it, and how independent you become from the backend release cycle.

The five frontend options at a glance

Luma, the native default theme

Luma (and the Blank theme underneath it) is the frontend that ships with Magento out of the box. It renders server-side through PHP, layout XML, PHTML templates, RequireJS, and Knockout.js. The upside: it is already there, it knows every Magento feature, and practically every Marketplace extension is built for it.

The price is performance. The frontend stack is heavy, the JavaScript bundles are large, and good Core Web Vitals scores are hard work with Luma. The developer experience is also particular: anyone coming from the modern JavaScript world finds Knockout.js and layout XML awkward. Luma is a solid choice for smaller catalogs, tight budgets, or teams already deep in the PHP Magento ecosystem.

Hyvä

Hyvä is a replacement theme that swaps out the Luma frontend stack without leaving the Magento backend. Instead of Knockout.js and RequireJS, Hyvä relies on Tailwind CSS and Alpine.js and drops most of the bundled JavaScript. The result is much leaner pages and noticeably better performance, often without touching your backend architecture.

The important framing: Hyvä is coupled. It still renders server-side inside Magento; it only replaces the frontend technology. That keeps the switch manageable for existing Magento teams and keeps you close to the backend. The downside: extensions built for Luma often need a Hyvä compatibility layer, and you stay tied to the Magento rendering path. For many mid-sized stores, Hyvä is today the pragmatic sweet spot between performance and effort.

PWA Studio

PWA Studio is Adobe's own approach to a decoupled frontend. It is a React-based toolkit (with Venia as the reference storefront) that talks to the backend through Magento's GraphQL API. The frontend runs as a standalone Progressive Web App, separate from the PHP stack.

That gives you a modern JavaScript codebase, app-like navigation, and the freedom to deploy the frontend independently. The effort is real, though: PWA Studio is complex, the learning curve is steep, and the community is smaller than the one around Hyvä. You also take on responsibilities that Luma handles for you, such as SEO rendering, caching, and rebuilding features that simply exist in the native theme. PWA Studio suits teams with React skills who deliberately want a decoupled, Adobe-native frontend.

Fully headless

Fully headless means the frontend is a completely standalone project of your choosing, built on Next.js, Nuxt, or another modern framework, and Magento is just one of several data sources behind it. Communication runs through the GraphQL or REST APIs. Unlike PWA Studio, you are not tied to Adobe's toolkit.

This is the most flexible option. You can pick the best framework for your team, combine multiple backends (for example Magento for commerce, a separate CMS for content, a search engine like Algolia), and scale and ship the frontend independently. The price is responsibility: you build and operate the entire integration layer, the caching, the SEO rendering, and the data orchestration yourself. A fully headless project is a genuine engineering effort, not a theme swap. It pays off when frontend differentiation, multi-backend requirements, or multiple touchpoints are in play.

Frontend Management Platform (FMP)

A Frontend Management Platform takes the headless idea, decoupling the frontend from the backend, and layers an operations and editorial layer on top. Instead of building every integration, the caching, the rendering, and the editor yourself, you get that layer as a product. Magento stays the commerce backend, the frontend renders decoupled, and your team assembles pages in a visual editor rather than triggering a deploy for every change.

The difference from raw headless is in the operations. With fully headless, your team owns and maintains the entire frontend machinery. An FMP takes over the recurring parts, the data layer, the performance tuning, the editor interface, and lets your team work on content and experience. That is the approach behind Laioutr's Composable Headless Frontend: the benefits of decoupling without every project starting from zero.

Comparison: trade-offs at a glance

  • Dimension | Luma | Hyvä | PWA Studio | Fully headless | FMP
  • Coupling to backend | Tightly coupled | Coupled | Decoupled | Decoupled | Decoupled
  • Performance ceiling | Low | High | High | Very high | Very high
  • Developer experience | Knockout/XML | Tailwind/Alpine | React toolkit | Free choice | Editor plus framework
  • Extension compatibility | Full | Partial, bridge needed | Limited | Self-built | Via integration layer
  • Frontend operating effort | Low | Low to medium | High | Very high | Covered as a product
  • Multi-backend capable | No | No | Limited | Yes | Yes
  • Fits | Small catalogs | Mid-sized stores | React teams | Differentiation | Teams without a frontend foundation

When you should decouple the frontend from the backend

Not every setup needs to be decoupled. A small store with a stable catalog and a tight budget is often better served by Luma or Hyvä than by its own headless project. Decoupling pays off when you recognize one of the following patterns.

First: frontend performance is a business problem and the coupled stack cannot keep up, despite caching and optimization. Second: your team ships too slowly because every campaign or landing page depends on a deploy and the backend release cycle. Third: you need more than one backend, such as a separate search engine, a dedicated CMS, or several commerce systems behind one brand. Fourth: you serve multiple touchpoints (web, app, in-store) from the same data layer.

When those patterns show up, the next question is not whether, but how much frontend machinery you want to own. Fully headless gives you maximum control at maximum responsibility. An FMP like Laioutr's Composable Storefront gives you the decoupling without your team building and maintaining the integration, caching, and editor layer from scratch.

FAQ

Is Hyvä the same as headless? No. Hyvä swaps the frontend technology but still renders server-side inside Magento and stays coupled to the backend. Headless means the frontend is a standalone project that talks to Magento through APIs.

Do I have to switch my Magento backend to decouple? No. PWA Studio, a fully headless frontend, and an FMP all talk to your existing Adobe Commerce or Magento 2 through the GraphQL or REST APIs. The backend stays; only the presentation layer moves up front.

What is the difference between PWA Studio and fully headless? PWA Studio is Adobe's own React toolkit with prescribed conventions. Fully headless means you choose the framework and architecture freely, and Magento can be just one data source among several.

Where does a Frontend Management Platform fit in? An FMP is decoupled like headless, but ships the operations layer (data connectivity, performance, visual editor) as a product. It fits teams that want the benefits of decoupling without building the entire frontend infrastructure themselves.

What is the fastest performance win without a large project? For most coupled Magento stores, moving from Luma to Hyvä is the most pragmatic step. It improves performance noticeably without touching the backend architecture.

More from the Laioutr Platform

  • Composable Headless Frontend: how a decoupled frontend sits on top of Adobe Commerce or Magento 2 without your team building all the machinery.
  • Composable Storefront: the storefront as a standalone layer that can serve multiple backends.
  • Frontend as a Service: the operations and editorial layer for a decoupled frontend, delivered as a product.
  • Agentic Frontend Management Platform: how AI agents take over routine changes to the frontend.

Next step

Want to know which frontend option fits your Magento or Adobe Commerce setup? Talk to the Laioutr team and we'll walk through your current architecture, from Luma to FMP, and show you where decoupling makes sense and where it does not.


Compartir este artículo

Más artículos interesantes

Conocimiento práctico sobre desarrollo frontend, agentes inteligentes y headless

Al blog
Hero business en

iPhone Duo and Ecommerce: What Merchants Need to Know Now

iPhone Duo goes on sale on October 23, 2026. Online stores don't need a dedicated app or a custo…
Structured product data pim frontend 2026 hero es

Datos de producto estructurados: cómo se notan en tu storefront

Datos de producto estructurados significa que cada dato del producto vive en un atributo tipado, con…
Storefront proof of concept dach buyers 2026 hero es

El 44 % decide con prueba o PoC: el PoC de storefront para DACH

En la región DACH, las decisiones de software se toman cada vez más con las manos en la masa: en el …
Frontend management platform comparison how to choose 2026 hero es

Comparativa FMP: cómo elegir la Frontend Management Platform adecuada

Elegir una Frontend Management Platform (FMP) no consiste en comparar listas de funciones, sino en s…
Dam pim cms convergence content hub storefront 2026 hero es

DAM, PIM y CMS convergen: qué significa para el frontend de tu tienda

Los proveedores de DAM, PIM y CMS están entrando en el terreno de los demás, y cada vez más equipos …
Contentful live preview frontend perspective 2026 hero es

Contentful Live Preview: lo que tu frontend tiene que resolver

Con Contentful Live Preview, los editores ven un borrador junto al editor de la entrada y siguen los…
Content governance product content brand assets frontend 2026 hero es

Gobernanza de contenido a gran escala: contenido de producto y assets

Gobernanza de contenido a gran escala significa definir una sola vez roles, aprobaciones, reglas de …
Ai agents as frontend operators 2026 hero es

Agentes de IA como operadores del frontend: arquitectura y control

Un agente de IA se convierte en operador del frontend cuando vigila el storefront en producción, det…
Shopping agents product feeds agentic data distribution 2026 hero es

Los agentes de compra leen tu feed: qué cambia el Agentic Commerce

El Agentic Commerce añade un nuevo lector a tus datos de producto: los agentes de compra de ChatGPT,…
Server side tracking ecommerce complete measurement 2026 hero es

Server-side tracking en e-commerce: la medición vuelve a ser completa

El server-side tracking traslada el envío de eventos de analítica y conversión desde el navegador de…
Product image deeplinks asset distribution 2026 hero es

Imágenes de producto por deeplink, no por ZIP: assets siempre al día

Si todavía envías las imágenes de producto a distribuidores, marketplaces y prensa en archivos ZIP, …
Prestashop 8 to 9 upgrade without replatforming 2026 hero es

De PrestaShop 8 a 9 sin replatforming: desacopla primero el frontend

Puedes quitar la mayor parte del riesgo de la actualización de PrestaShop 8 a 9 si separas la storef…
Order management fulfillmenttools oms frontend 2026 hero es

Order management con un OMS como fulfillmenttools: la vista frontend

Un order management system eficiente decide qué ubicación prepara un pedido, cuánto stock hay realme…
No replatforming budget frontend project approval 2026 hero es

¿Sin presupuesto para replatforming en 2026? El frontend sí se aprueba

Si en tu presupuesto de 2026 no hay sitio para un replatforming, no eres el único, y no tienes por q…
Garden retail order management seasonal frontend 2026 hero es

Gestión de pedidos en jardinería: lo que tu storefront debe mostrar

En el retail de jardín y bricolaje, un mismo carrito puede contener un artículo que va en paquete, u…
App Shopify
Laioutr
Shopify
Shopify es una plataforma de comercio para vender online y en tienda física.
App shopware
Laioutr
Shopware
Shopware es una plataforma de e-commerce flexible de origen europeo para catálogos de productos y comercio omnicanal.
App adobe commerce
Laioutr
Adobe Commerce
Adobe Commerce es una plataforma de comercio empresarial para escenarios B2C y B2B complejos y globales.
Planned
App B2B sellers suite
Laioutr
B2Bsellers
Suite B2B para Shopware que convierte la tienda online en una plataforma profesional de comercio B2B.
Planned
App commerce layer
Laioutr
Commerce Layer
Commerce Layer es una plataforma de headless commerce para que inventarios y catálogos estén disponibles online.
App commercetools
Laioutr
Commercetools
Commercetools es una plataforma de e-commerce headless basada en SaaS y utilizada en todo el mundo.
App emporix
Laioutr
Emporix
Emporix es una plataforma de composable commerce API-first para escenarios B2B y B2C escalables.
Planned
App HCL Software
Laioutr
HCL Software
Suite empresarial de comercio y experiencia digital con un alto grado de configurabilidad.
Planned
App intershop
Laioutr
Intershop
Plataforma de comercio empresarial para modelos de negocio B2B y B2C complejos.
Planned
App magento 2
Laioutr
Magento 2
Plataforma de comercio ampliable y muy extendida para escenarios B2C y B2B.
App Oxid
Laioutr
OXID eShop
OXID eShop es una plataforma de comercio ampliable para requisitos B2B y B2C complejos.
Planned
App cover patchworks
Laioutr
Patchworks
Patchworks es un iPaaS low-code que conecta e-commerce, ERP, WMS, 3PL y marketplaces.
Planned
App PRESTASHOP
Laioutr
Prestashop
Plataforma de comercio open source para pequeños y medianos comerciantes en Europa y más allá.
Planned
App saleor
Laioutr
Saleor
Plataforma de comercio open source y API-first basada en GraphQL para storefronts a medida.
Planned
App Commercecloud
Laioutr
Salesforce Commerce Cloud
Salesforce Commerce Cloud es una plataforma de comercio empresarial en la nube para empresas de cualquier tamaño.
Planned
App SAP
Laioutr
SAP Commerce Cloud
Plataforma de comercio empresarial para catálogos complejos, modelos de precios y recorridos omnicanal.
Planned
App SCAYLE
Laioutr
Scayle
SCAYLE es un motor de comercio con el que marcas y comerciantes escalan su negocio.
Planned
App spryker
Laioutr
Spryker
Plataforma de composable commerce para modelos de negocio B2B y B2C exigentes.
App Sylius
Laioutr
Sylius
Sylius es un framework de e-commerce pensado para desarrolladores y para experiencias de compra B2C y B2B.
Planned
App vendure
Laioutr
Vendure
Vendure es una plataforma de headless commerce para empresas con requisitos complejos.
Coming Soon
App VTEX
Laioutr
VTEX
Plataforma de composable commerce cloud native para B2B y B2C a gran escala.
Planned
App Websale
Laioutr
Websale
Backend de comercio estable y apto para grandes empresas en entornos comerciales complejos.
Book a demo mobile
Llamada estratégica

¿Listos para convertir su frontend en una capa de control?

Muéstranos tu stack, tu roadmap, tu escenario de replatforming, y te mostraremos cómo encaja Laioutr, cuánto cuesta y qué tan rápido puedes estar en producción.

"Después de 30 minutos supimos que Laioutr hace viable nuestro replatforming." - Daniel B., CEO, hygibox.de

Reserva una demo
SEO / GEO / AEO Ready
Rendimiento y Core Web Vitals
WCAG 3.0 Ready
Seguimiento & Analytics
Consistencia de marca
Laioutr Logo

The frontend control plane for every digital business model, built in hours, integrated with any system, fully in your hands.

Plataforma
Agentic Frontend Management Platform
Composable Digital Experience Platform
Composable Visual Page Builder
Composable Headless Frontend
Frontend as a Service
Agentic Frontend Management Platform
Composable Digital Experience Platform
Composable Visual Page Builder
Composable Headless Frontend
Frontend as a Service
Producto
Gestión de contenidos basada en IA
AI Search & Discovery
AI Engagement & Conversion
Personalización basada en IA
A/B Testing basado en IA
Multi Brand y Multi-Market
SEO y GEO con IA
Composability & Orchestration
Integraciones No-Code
Gestión de contenidos basada en IA
AI Search & Discovery
AI Engagement & Conversion
Personalización basada en IA
A/B Testing basado en IA
Multi Brand y Multi-Market
SEO y GEO con IA
Composability & Orchestration
Integraciones No-Code
Recursos
DocumentaciónChangelogInsightsComunicados de prensaRelease NotesEventos y webinarsRecursos de aprendizajeApp Store
Demos de Tienda
Casos de éxito
DocumentaciónChangelogInsightsComunicados de prensaRelease NotesEventos y webinarsRecursos de aprendizajeApp Store
Demos de Tienda
Casos de éxito
Empresa
Sobre nosotros
Por qué Laioutr
Programa de Partners
Programa Whitelabel
Programa Startup
Empleo
Glosario
Preguntas frecuentes
Sobre nosotros
Por qué Laioutr
Programa de Partners
Programa Whitelabel
Programa Startup
Empleo
Glosario
Preguntas frecuentes
Comparar
vs Frontastic
vs Alokai
vs Storyblok
vs Contentful
vs Hygraph
vs Pack Digital
vs Pagefly
vs Gempages
vs Shogun
vs. Instant Commerce
Alternativas de Frontend
vs Frontastic
vs Alokai
vs Storyblok
vs Contentful
vs Hygraph
vs Pack Digital
vs Pagefly
vs Gempages
vs Shogun
vs. Instant Commerce
Alternativas de Frontend
Agentic Frontend
para Shopify
para Commercetools
para Sylius
para Shopware
para Emporix
para Magento 2
para Adobe Commerce
para VTEX
para OXID
para Spryker
para Salesforce Commerce Cloud
para Shopify
para Commercetools
para Sylius
para Shopware
para Emporix
para Magento 2
para Adobe Commerce
para VTEX
para OXID
para Spryker
para Salesforce Commerce Cloud
Page Builder
para Typo3
para Contentful
para Storyblok
para Sulu.io
para Magnolia
para Strapi
para Contao
para Hygraph
para Sanity
para Wordpress
para Kontent.ai
para Typo3
para Contentful
para Storyblok
para Sulu.io
para Magnolia
para Strapi
para Contao
para Hygraph
para Sanity
para Wordpress
para Kontent.ai
UI Growth Kits
para la IA
para B2C
para B2B
para el retail multicanal
para marcas
para el turismo
para marketplaces
para proveedores SaaS
para editores y medios
para el checkout
Frontend Blueprints
para la IA
para B2C
para B2B
para el retail multicanal
para marcas
para el turismo
para marketplaces
para proveedores SaaS
para editores y medios
para el checkout
Frontend Blueprints
info@laioutr.com

© 2026 Laioutr GmbH

Aviso legalCondiciones de usoPolítica de privacidad AccesibilidadTrust Center