Frontend & Hyvä 11/16/2020

Hyvä Themes and the Magento frontend problem

Magento's major strengths include its multi-store functionality and customizability; from a developer's point of view these are probably mainly the Dependency Injection and the API support. Unfortunately, the frontend is not one of its strengths: both the traditional frontend "Luma" and the modern approach "PWA" have their own problems. What these problems are and why we think that only a new approach can solve them is explained in this article.

The traditional Magento Frontend "Luma"

Already at the time of the release of Magento 2 the basis of the own frontend was considered outdated. To support dynamic components, Magento introduced UI Components. The aim was to provide a more modern frontend that allows for extensions and the handling of many individual components and is expendable the same time. The UI Components were especially used in the check-out and admin area. However, there were also plans to extend them to the entire frontend and therefore replace the old one.

Unfortunately, these changes caused an enormous additional workload for developers. The UI components, which are very adaptable, required an enormous amount of practice. Even experienced developers needed a lot of time for seemingly small adjustments due to the complexity.

Overall, the Luma theme is based on tried and tested techniques such as jQuery, RequireJS, knockout.js and LESS, which are very robust but cannot be regarded as completely up-to-date. In particular, Luma suffers from an enormous amount of JavaScript code, which causes long loading times, especially when used on mobile devices. These can only be improved by enormous effort, which is why the Luma theme is not an optimal solution for us.

The solution seems within reach

A new technology emerged: Progressive Web Apps (PWAs). PWAs as frontend combine the advantages of native apps with a website. Already in April 2018 we became aware of this and started with our own PWA-based projects. The disillusion came quickly. The performance promises could only be kept under certain conditions - especially the first page view of a shop requires the download of several MB of JavaScript code, which in turn slows down especially on mobile devices.

Our experience includes development with Vue Storefront and Magento PWA Studios. So far, we do not believe that both solutions offer a stable base and sufficient feature coverage. For us there are two scenarios in which the implementation of the frontend with PWAs currently makes sense: If one stays close to the standard so that there is not much that needs to be done; or if the shop is large enough to provide a large budget and the frontend can therefore be largely redesigned.

Is this supposed to be the solution?

What about small and medium-sized shops or companies looking for a more efficient and cost-effective solution? We have asked ourselves this question over and over again, but could not find a satisfactory answer. For this reason, we have taken the solution of the problem into our own hands.

 

Hyvä Themes

Hyvä Themes is the new magento Frontend, which was developed by our colleague Willem Wigman along with with us. Due to years of experience in Magento development and networking in the community, we were aware of the core of the problem and the idea for a new solution was born. 

With Hyvä Themes, we have launched a Magento front-end that is much less complex and does not suffer from the enormous amount of code. The system is characterised by the slim JavaScript based on AlpineJS. In the standard version we achieve a Lighthouse-Score (the official performance indicator of Google) of over 90, even on mobile devices. This score reflects the fast loading times and means a good ranking by Google. In addition, Hyvä Themes convinces with its modern tailwind framework for design. The implementation and further development of the frontend is therefore much faster. Not only developers benefit from this, as the implementation is less frustrating, but also the customers do through the possibility to design projects efficiently.


Hyvä Themes sounds interesting to you?

In this newsletter you will receive news about Hyvä Themes and Hyvä Checkout. You can always unsubscribe from this newsletter for free.

I agree that my data may be used for sending the newsletter as explained in the Privacy Statement.Â