5 Reasons You Should Be Using HAML Instead of ERB

Uriah Harston
4 min readDec 30, 2020
Photo by Kenneth Schipper Vera on Unsplash

Haml has nothing to do with pork, ham, or any of the three little piggies and the big bad wolf, but you knew that right? Haml stands for HTML Abstraction Markup Language. It is a powerful tool that replaces standard ERB and should be in every Ruby Developer’s toolchain because it can get rid of those big bad wolves. Let consider how…

1. Speeds Up Development

That’s right! We are talking about speed. Chances are if you are using Ruby on Rails you know it is about “convention over configuration”. A lot of the design choices are already made for you. This enables development to be very quick when using Rails.

The bottleneck in the process is often when coding the HTML for the views. We often rely on auto-completion, and self-closing HTML tags to speed up this step. When you set the language mode to erb you lose the self-closing HTML tags. Do it the other way around, you lose the self-closing erb tags.

ERB Language Mode in VS Code

Haml is better because there are no closing tags. It uses indentation to determine the parent-child hierarchy. It is very similar to SASS in that way. It is beautiful. *sheds one tear*

ERB Button Container
Haml Button Container

2. Easier To Debug

Many Rails-based online stores use Haml for its cleanliness and readability. It is a no-brainer as to why. It is easier to introduce bugs when coding with difficult or redundant syntax. It can be a challenge to find these bugs in verbose code, like ERB. Code that you didn’t write in the first place. With Haml’s indentation focused syntax, it will be harder to make mistakes, and easier to find them if you do.

It would be really hard to make Haml ugly. I don’t challenge you to try either. One of the ideas behind Haml is that it should be beautiful, simple, and readable like that haiku from back in grade school.

3. Super DRY

It is super DRY, and I am not talking about the coats, although those are really nice too.

As mentioned earlier, there are no closing tags with Haml. There is actually no reason to type the <, >, or / keys again! That lunge to the shift key and the back step of the pinky finger is gone. You will need to find another form of exercise I suppose…

4. Quick To Learn

The official Haml website encourages you to take 5 minutes to read the tutorial, and in 20 minutes you will laugh and never go back. I can testify that is this is true. It may not be worth it to redo a finished project in ERB with Haml just because. The benefits are with fresh projects. Future endeavors. It doesn’t take long to learn and the time you will save on projects is immeasurable.

5. Easy to Install

Haml takes less than a minute to install. Simply gem install haml or include
gem “haml" in your Gemfile and bundle install.

Then you just change your file suffix from erb to haml.

home.html.erb => home.html.haml

Download a VS Code extension for Haml autocompletion and syntax highlighting and you are good to go.

I made a Pinterest mock for cars, and I recently converted the homepage from ERB to Haml just to try it out. Below you can see the difference

streetbuilds.herokuapp.com Homepage in ERB
streetbuilds.herokuapp.com Homepage in Haml

Final Words

Good tools are what separates an amateur from a professional in any industry. Just imagine if a carpenter had no power tools today. I recently learned about Haml from talking to a developer with a lot of experience. I have 2 takeaways from this all. First, I wish I started using Haml way sooner! The second lesson is to value the people in the community you are part of. In the developer community, there is always something we can learn from each other.

Cheers!!

Sources: https://haml.info/

--

--