Mike Cole Mike Cole
Reading Time: 1 minute

Introduction

For many years, Magento has not had much with choice with the frontend themes that are used on the store, and some owners have often had to resort to themes that are already available which are often bloated which cause Performance issues and can become difficult to develop with and even harder to maintain. This is where Hyvä comes in.

What came before Hyvä

Before Hyvä, when you wanted a Magento store, you where often left with little choice. You could go with the Luma theme which was pre-installed with Magento and this was written in LESS CSS, or you could go with a SASS/SCSS based theme which would be the Snowdog Theme, or if you had very little Magento development experience, you could purchase a theme such as Ultimo.

These themes work and you could launch a store with them, but they come with several disadvantages

  • Complexity – With these themes (especially off the shelf themes), they come with a lot of additional/unneeded features that you may not use and are difficult to remove.
  • Performance – These themes are often bloated and could result with a slower store and poor Google Pagespeed Scores (Luma can earn 58/100)
  • One Size Fits All – With “Off the Shelf” themes, they are built to be generic and may not fit your bespoke needs.

Why Hyvä Is Different

Hyvä has been built from the ground up with performance in mind, and this has been done by replacing all the styling with TailwindCSS, and all the javascript libraries (i.e jQuery, KnockoutJs, RequireJs), with one modern javascript framework which is AlpineJS.

 

By doing this, it means that Hyvä achieves exceptional Google Pagespeed scores for the theme before adding additional optimisations such as WebP images, JS/CSS optimisation (TailwindCSS is minimal). 

Having a better Pagespeed score can also have other benefits from an SEO perspective as search engines will preferrer a faster performing website, and from a customer perspective as a customer is less likely to leave the store before a purchase if the store is fast to use.

Outside of performance, the theme also has benefits for development as the theme is built on modern web development tools and practices so not only is it faster to develop with, the tools and frameworks are more cutting edge and less likely to be unsupported compared to tools in the older themes such as KnockoutJs or LESS CSS. The theme is also easier to maintain as the Hyva theme is installed via composer so it can be easily upgraded, and a child theme can be created that extends the Hyvä theme so you only need to modify the templates that you need.

When building with the Hyvä theme, some module may require some additional work to optimise so that they can work with the theme, but there is already a large collection of Modules that have been made compatible both by Hyvä and WeAreMagento.

Hyvä vs PWA

Another area of theme development in Magento is PWA (Progressive Web Apps) themes, and these can be implemented via either the Magento PWA Studio or other solutions such as Vue Storefront. These may seem like appropriate alternate solutions, but they also come with their own issues.

These themes are still in their infancy and because of this, there can be issues with documentation not being available, major features changing which can result in a theme that is harder to maintain, and a constantly changing development tools. Hyvä meanwhile is fully documented and still uses the same template and layout names as a standard Magento theme so it’s less likely to cause issues between upgrades.

With PWA themes still being a new concept, this also means that there is less support for these themes so it can be harder finding modules that are compatible with the themes, and they can also be harder to find information on if you run into issues. When you purchase a license to Hyvä, you receive access to the Hyvä Slack group where you have direct contact to the developers of the theme, and access to the library of compatible modules which work with most of the major Magento modules that are available such as Amasty Gift Cards or Smile Elasti-Suite.

One of the major misconceptions with PWA themes is that because they are primarily built for mobile, and hosted separately to the Magento store, they should be performant but this is not always the case. A theme like PWA studio is built on ReactJS and several other Javascript frameworks, and this can bloat the storefront with additional files which results in having slower site. Not only Hyvä faster as it relies on just TailwindCSS and AlpineJs, but because its installed in the Magento instance as a traditional theme, and not hosted separately, the theme has direct access to the information/data from the store so where a PWA theme would have to make many Rest/GraphQL requests for data (i.e. Products, Customer, Basket) which can slow down the storefront on the load of the page, this information can be retrieved and rendered before the page load like a standard theme.

As mentioned above, WeAreMagneto believe that Hyvä is a better solution compared to a PWA theme as its built around the same principles as Magento, it is more performant, and it is much easier to develop with which results in a faster development time. 

Hyvä may seem to miss out on some benefits of the PWA themes such as Offline Pages, Offline Google Analytics, Browser Caching or being made installable on the users device, but these feature can actually be added with the use of the Hyvä recommended PWA module, and this will add all these missing features so you store can have the best of both worlds. 

Future of Hyvä

With the introduction of Hyvä, the misconception of Magento being slow and the architecture bing date is a thing of the past as Hyvä is built for speed in both performance and development time, and using cutting edge tools. The theme is also being constantly upgraded and improved with features being added regularly (monthly releases).

In addition to the theme, Hyvä is also working on even more compatibility modules, a brand new checkout alternative which will include all the benefits of the base Hyvä theme to allow the customer to have a faster checkout experience, and they are also adding tools to improve the admin of Magento as well.

WeAreMagento are currently working with Hyvä as the recommended frontend theme so why not get in touch with the team.