Luma and Hyva are two completely different themes for Magento 2. Luma is a base theme distributed with Magento. Its main advantage is that all extensions are developed with full support for Luma by default. However, it relies on older technologies such as jQuery and RequireJs, which negatively impact the site speed.
In contrast, Hyvä is a new theme developed by third-party creators with modern standards for speed and performance in mind. It streamlines the website’s user experience while boosting performance metrics.
In this article, we’ll compare Luma and Hyvä side by side and weigh various speed metrics to help you decide whether to migrate your website to Hyvä. We have tested vanilla Magento installations on both themes and assessed their initial performance to determine whether Hyvä offers a significant advantage.
Key Performance Differences Between Hyvä and Luma
From the beginning, Hyvä theme has been designed with a focus on speed and a positive user experience. So, it’s no surprise that it performs better, especially on mobile devices.
The main reason for the decline in performance metrics is the number of scripts that block interaction with the page:
- Luma uses a lot of JavaScript files. That’s why the user must wait for them to load each time before they can interact with the page.
- Hyvä doesn’t have that many files to load. Only one AlpineJs library is loaded, while the remaining scripts are already embedded in the page. This eliminates the latency and allows the page to be delivered to the user more quickly.
Another reason for the drop in performance is the way images are loaded:
- In Luma, images are often loaded at one size and then resized to the required dimensions using styles.
- In Hyvä, images are loaded at the exact size that will be used on the page.
The other significant distinction is how JavaScript components are handled:
- In Luma, it is common for a page to require only a portion of the functionality from the JavaScript component, but instead, the entire file is loaded.
- In Hyvä, only the scripts needed for a particular page are included, ensuring more efficient resource loading.
Additionally, performance is also affected by the theme’s overall structure and design:
- Luma makes use of a monolithic structure, which is less modular and has templates and components that are tightly integrated.
- However, by employing a modular strategy and putting performance first, Hyvä promises more benefits in this domain.
In-Depth Analysis: Hyvä and Luma Performance Metrics
On a vanilla Magento installation, we measured site speed using the Page Speed Insights tool to find out what initial performance both themes offer. It is clear that third-party modules and custom functionality may affect speed, but it is important that the theme itself is initially fast enough and does not slow down the site. Here’s what our research shows:
In the next section, we provide screenshots where you can compare the Performance metric in Luma vs Hyvä on different pages, including FCP (First Contentful Paint), LCP (Largest Contentful Paint), TBT (Total Blocking Time) and CLS (Cumulative Layout Shift).
Luma VS Hyvä Performance on Desktop Devices
Homepage
Category Page
Product Page
Hyvä VS Luma Performance on Mobile Devices
Homepage
Category Page
Product Page
Conclusion
Hyvä and Luma are distinct Magento themes that have their own strengths and weaknesses. Generally, Luma stands as an outdated and slow option for the ecommerce business compared to the brand-new Hyvä.
Hyvä theme is an incredibly powerful and essential theme for online retailers, thanks to its use of innovative technologies, minimalistic style, and speed optimization techniques. The theme helps to hit new performance scores and streamline the user experience of your store to drive more sales. Feel free to reach out to us for expert Hyvä theme migration and custom development to take your Magento store to the next level!