Hyvä per Magento 2: frontend veloce, Core Web Vitals e 3 casi reali

Partner ufficiale — Hyvä Themes & Hyvä Checkout.

Magento 2 è una delle piattaforme e-commerce più potenti del mercato, ma il suo frontend storico (Luma) è anche uno dei più pesanti. Hyvä è la risposta della community: un nuovo tema costruito da zero per essere veloce, semplice da mantenere e pronto per i Core Web Vitals.

In questo articolo spieghiamo cos'è Hyvä, come funzionano Hyvä Themes e Hyvä Checkout, perché impatta direttamente su SEO e conversioni, e mostriamo i risultati reali ottenuti su tre progetti: Motonice, Schermi Online.

Cos'è Hyvä

Hyvä è un frontend alternativo per Magento 2/Adobe Commerce. Sostituisce l'intero stack basato su Knockout.js, RequireJS e LESS con uno stack moderno: Tailwind CSS e Alpine.js. Il risultato è un tema con pochi KB di JavaScript, CSS pulito e zero dipendenze pesanti.

Hyvä non è un fork di Magento: è un tema ufficialmente certificato, compatibile con il core e con un ecosistema di moduli partner in continua crescita.

Perché è così veloce

• ~25 KB di JS in pagina vs centinaia di KB di Luma.
• Niente RequireJS, niente jQuery, niente Knockout.
• CSS generato con Tailwind: solo le classi effettivamente usate.
• Meno HTTP request, meno layout shift, meno tempo per il main thread.

In pratica: meno codice spedito al browser = LCP, INP e CLS migliori senza compromessi sull'esperienza.

Hyvä Themes (frontend)

Hyvä Themes è il pacchetto principale: include il tema base, un sistema di componenti UI già pronti (header, mini-cart, PLP, PDP, account) e il compatibility module che permette di far funzionare moduli di terze parti pensati per Luma.

Per i nostri progetti partiamo sempre da Hyvä base e costruiamo sopra il design system del cliente, mantenendo il controllo su markup e performance.

Hyvä Checkout

Hyvä Checkout è un checkout headless basato su React, completamente disaccoppiato dal frontend Magento. Comunica con Magento via GraphQL e offre:

• Esperienza one-page, fluida, senza reload.
• Supporto nativo ai principali payment provider (Stripe, Adyen, PayPal, Klarna…).
• Form ottimizzati per mobile, validazioni in tempo reale.
• Customizzazione completa via React components.

L'impatto più diretto è sul tasso di conversione: meno frizione, checkout più rapido, meno abbandoni del carrello.

Core Web Vitals e SEO

Google premia esperienze veloci. Hyvä aiuta in modo concreto su tutti e tre i Core Web Vitals:

• LCP (Largest Contentful Paint): hero e immagini renderizzate molto prima grazie al ridotto JS bloccante.
• INP (Interaction to Next Paint): il main thread resta libero, le interazioni sono immediate.
• CLS (Cumulative Layout Shift): layout stabile, niente blocchi che si spostano dopo il caricamento.

Le soglie ufficiali di Google

Per stare in zona verde e non perdere ranking, ogni metrica deve rispettare la soglia "Buono" sul 75° percentile del traffico reale (CrUX).

Metrica	Buono	Migliorabile	Insufficiente
LCP · Largest Contentful Paint	≤ 2,5s	2,5 – 4s	> 4s
INP · Interaction to Next Paint	≤ 200ms	200 – 500ms	> 500ms
CLS · Cumulative Layout Shift	≤ 0,1	0,1 – 0,25	> 0,25

Lo score PageSpeed in pratica

• 0–49 (rosso): lo store è penalizzato in SEO mobile, l'esperienza utente è frustrante.
• 50–89 (arancio): zona "passa per ora" ma non scala. Ogni nuovo modulo Luma rischia di farti tornare in rosso.
• 90–100 (verde): zona Hyvä. Tempo di interazione immediato, hero in <1,5s su mobile 4G.

Ogni 100ms di latenza in checkout costa fino al 7% di conversione (fonte: Akamai/Deloitte). I 3 secondi che togli a un LCP rosso sono il singolo investimento con il ROI più alto su Magento 2.

Casi studio: Motonice, Schermi Online

Tre migrazioni a Hyvä che abbiamo seguito direttamente. Numeri reali, misurati con PageSpeed Insights e CrUX, prima e dopo il go-live.

Motonice — ricambi moto, catalogo profondo

• PageSpeed mobile: 38 → 94
• LCP: 4.8s → 1.6s
• INP: 380ms → 120ms
• CLS: 0.21 → 0.02
• Conversion rate: +38%

→ Leggi il case study completo

Schermi Online — schermi e display professionali

• PageSpeed mobile: 42 → 96
• LCP: 4.2s → 1.4s
• INP: 320ms → 95ms
• CLS: 0.18 → 0.01
• Conversion rate: +27%

→ Leggi il case study completo

Quando scegliere Hyvä

Hyvä è la scelta giusta se:

• Sei su Magento 2 / Adobe Commerce e i Core Web Vitals sono in rosso.
• Vuoi ridurre i costi di sviluppo frontend nel medio periodo.
• Hai un team marketing che vuole muoversi più velocemente sulle pagine.
• Stai pianificando un redesign: è il momento perfetto per migrare.

Il nostro servizio Hyvä

In 1604 Lab progettiamo, migriamo e manteniamo store Magento 2 con Hyvä Themes e Hyvä Checkout. Audit performance, design system, sviluppo, monitoraggio post-lancio.

→ Scopri il servizio Hyvä di Nexium