Hyva

Share

22 MAR 2024

High-Performance Frontends with Accelerated Development

Hyvä acts as a rejuvenating force for Magento. This community-developed theme modernizes accessible frontend technologies, simplifying development and enabling the creation of much more performant webshops than with themes based on Adobe Commerce's tech stack. DELABYTE has already implemented initial web projects with Hyvä and is an official supplier of the theme. We recommend its use for every new project.


Hyvä Overview

What is Hyvä?

Hyvä is a Magento theme based on a modern tech stack. Unlike classic themes, Hyvä does not use JavaScript frameworks like Knockout.js, require.js, and jQuery. Instead, it relies on AlpineJS and TailwindCSS.

What are the benefits of Hyvä?

A key advantage for online shop operators is improved performance. Due to its lower complexity and lean approach, web pages load much faster, simultaneously reducing development effort. Shop operators benefit from a shorter time-to-market.

How much does Hyvä cost?

The Dutch company Hyvä Themes B.V. distributes the theme under very fair licensing terms. The license for a Magento 2 installation with any number of domains and StoreViews costs a one-time fee of 1,000 euros plus VAT and includes all future updates. There are no ongoing costs.


Technological Leap for Magento Frontend

Since its release, Hyvä has caused a stir in the Magento scene. Version 1.0 of the template developed by Willem Wigman was released in early 2021 and has since exerted significant influence on the Magento ecosystem. Hyvä is increasingly becoming important in the development of new online shops based on Magento. Willem Wigman has developed the theme from scratch, creating a technically leaner alternative to the existing standard themes. The term "hyvä" comes from Finnish, meaning "good".

"While the JavaScript world is rapidly evolving, not much has happened with Magento for a long time. With Hyvä, that changes. We can now build much more performant Magento shops in less time with modern technologies."


Reduced Complexity and Improved Performance

Instead of Knockout.js, RequireJS, and jQuery, Hyvä uses AlpineJS and TailwindCSS. This shift to lean and modern frameworks is largely responsible for the increase in performance. AlpineJS enables asynchronous API calls, eliminating the need to load numerous JavaScript files. With the old tech stack, it was nearly impossible to achieve top scores in tools like Google's PageSpeed. With Hyvä, pages load much faster, achieving PageSpeed scores of 99 or 100.

Alpine and Tailwind Figure 1: Alpine.js and Tailwindcss


Development comfort and higher development speed

AlpineJS and TailwindCSS also provide a better Developer Experience. Instead of having to switch back and forth between different scenes during development, the essential work steps now all take place in HTML files. For example, TailwindCSS offers a range of utility classes that can be used directly in the HTML template. This opens up a pleasant and focused workflow for developers, which accelerates development.


Compatibility with Standard Themes and Modules

Hyvä can be flexibly deployed – even in combination with components of the standard themes of Adobe Commerce. However, since Hyvä is based on a new technology stack, it is not out-of-the-box compatible with all available Magento modules for the previous themes from Adobe and third-party providers. Such modules require compatibility modules for Hyvä, which reimplement certain parts considering the adjusted technical base. The Magento community is currently producing a constantly growing repository of compatible modules. How Adobe will respond to the community-driven technology update remains to be seen.