HAML vs MJML: What are the differences?
HAML: HTML Abstraction Markup Language - A Markup Haiku. Haml is a markup language that’s used to cleanly and simply describe the HTML of any web document, without the use of inline code. Haml functions as a replacement for inline page templating systems such as PHP, ERB, and ASP. However, Haml avoids the need for explicitly coding HTML into the template, because it is actually an abstract description of the HTML, with some code to generate dynamic content; MJML: The framework that makes responsive email easy. It is a markup language designed to reduce the pain of coding a responsive email. Its semantic syntax makes it easy and straightforward while its rich standard components library fastens your development time and lightens your email codebase. Its open-source engine takes care of translating it into responsive HTML.
HAML and MJML can be primarily classified as "Languages" tools.
HAML and MJML are both open source tools. It seems that MJML with 9.17K GitHub stars and 618 forks on GitHub has more adoption than HAML with 3.44K GitHub stars and 544 GitHub forks.
According to the StackShare community, HAML has a broader approval, being mentioned in 139 company stacks & 260 developers stacks; compared to MJML, which is listed in 9 company stacks and 3 developer stacks.
What is HAML?
What is MJML?
Need advice about which tool to choose?Ask the StackShare community!
Why do developers choose MJML?
Sign up to add, upvote and see more prosMake informed product decisions
What are the cons of using MJML?
Sign up to get full access to all the companiesMake informed product decisions
When we rebooted our front-end stack earlier this year, we wanted to have a consolidated and friendly developer experience. Up to that point we were using Sass and BEM. There was a mix of HAML views, React components and Angular. Since our ongoing development was going to be exclusively in React, we wanted to shift to an inline styling library so the "wall of classnames" could be eliminated. The ever-shifting landscape of inline CSS libraries for React is sometimes difficult to navigate.
We decided to go with Glamorous for a few reasons:
As you may or may not know, Glamorous has ceased active development and been mostly superseded by Emotion. We are planning to migrate to either Emotion or @styled-components in the near future, and I'll write another Stack Decision when we get there!
Personally, I really like HAML. Not having to use open and close tags is a huge time saver. As a result, writing markup with HAML is much more pleasant. HAML essentially forces you to be very strict about spacing, organization, and structure. It also makes the markup easier to read. Protip: I use this pretty frequently: htmltohaml.com