Book a Demo
MageDemo/Demo Guide
// make the most of the demos

Demo Guide

The MageDemo storefronts are fully functional Magento 2 environments. This guide walks through what to explore and how to evaluate what you are seeing.

// available demos

What's available

Hyvä Demohyva.magedemo.com

A live Magento 2 storefront running the Hyvä theme. Alpine.js + Tailwind CSS frontend, fully functional catalogue, search, cart, and checkout.

Open demo
Luma Demoluma.magedemo.com

A live Magento 2 storefront running the default Luma theme. The same Magento backend as the Hyvä demo — only the frontend differs.

Open demo
// step by step

How to explore the demos

01

Open the storefront

Launch either the Hyvä or Luma demo directly from the homepage. No login, no signup — the demo opens immediately as a live Magento storefront.

02

Browse categories and products

Navigate through the category pages and open a few product pages. Pay attention to how quickly each page responds, especially on the first load. Notice whether elements shift as the page renders.

03

Use search

Try the search bar. In Hyvä, search suggestions and results are rendered with Alpine.js, resulting in noticeably snappier interactions compared to the KnockoutJS-based search in Luma.

04

Add products to cart

Add a product to the basket and watch how the mini-cart updates. In Hyvä, the cart interaction is handled client-side without a full page reload. Compare this with Luma's approach.

05

Go through checkout

Proceed through checkout to see the full flow. The demo is fully functional — you can enter details and progress through each step. No payment is processed; the checkout stops before any transaction.

06

Check performance

Open Chrome DevTools (F12) and run a Lighthouse audit from the Performance tab, or use PageSpeed Insights on the demo URL. The scores speak for themselves.

// side by side

Comparing Hyvä and Luma

To get the most value from the demos, open both in separate tabs and compare them directly. These are the dimensions worth paying attention to.

Page load speed

Open both demos in separate tabs. Navigate to the same category page in each and compare how quickly content appears.

Layout shift

Watch whether page elements jump as each page loads. Hyvä is designed for zero Cumulative Layout Shift. Luma typically shows visible element movement.

JavaScript weight

In DevTools → Network → filter by JS. Hyvä typically ships 80–120 KB of JS. Luma regularly ships 400–600 KB or more on a standard storefront.

Mobile experience

Switch DevTools to a mobile device profile and test both. Hyvä maintains strong performance on mobile; Luma's Lighthouse mobile scores typically fall to 20–50.

Cart and search interactions

The mini-cart, search suggestions, and product options reveal how each frontend framework handles interactivity. Alpine.js (Hyvä) is noticeably lighter than KnockoutJS (Luma).

// good to know

A few things to know

Checkout stops before payment

You can complete the full checkout flow up to the payment step. No transaction is ever processed and no real payment details are required.

Demo data is reset periodically

The demo catalogue and cart data are reset regularly. Any items added to the basket or account data entered will not persist indefinitely.

Performance reflects real Hyvä

The Hyvä demo runs on Hypernode, a managed Magento hosting platform. The performance scores reflect a real production-grade setup, not a synthetic benchmark.

No account required

There is no login, registration, or signup of any kind required to use either demo. Open the URL and you are in.

Ready to explore?

Launch a demo and see Hyvä or Luma in action on a real Magento storefront.