HAML：简洁高效就是美

作者 Sam Aaron 译者 Jason Lai 发布于 2007年5月18日

领域

架构 & 设计,

语言 & 开发

主题

XHTML ,

Ruby on Rails ,

HTML ,

Ruby ,

动态语言 ,

标识语言 ,

语言 ,

模板语言 ,

编程

Dan Grigsby在他对Haml精采绝伦的介绍中，对Greenspun第十编程法则改头换面，炮制了Grigsby第一法则：

“任何足够复杂的rhtml partial里面都包含了一个特别的非正式定义并充满Bug且实现了一半的Haml。”

那么Haml到底是什么？Haml的作者Hampton Catlin如是说：

“Haml是对传统XHTML的生成方式的一种反叛。它既不是纯粹的代码，也不是一种文本处理语言。它是与众不同的，是一种在我看来最为自然的XHTML构造方式。”

此外，Haml的网站上说：“Haml让你撇开臃肿丑陋的模板，将它们以优雅整洁的代码代替。”下面我们先来简单看看到底丑陋的模板会是什么样子，而优雅整洁的代码又是如何：

下面是一个“丑陋模板”的范例：

<div id="profile">
  <div class="left column">
    <div id="date"><%= print_date %></div>
  </div>
  <div class="right column">
    <div id="email"><%= current_user.email %></div>
    <div id="bio"><%= h current_user.bio %></div>
  </div>
</div>

你可以看见，这只是标准的HTML/ERb的代码片断。对于你来说，这可能不会那么刺激审美神经。然而，正如Grigsby在他的文章中巧妙地解释到的，不仅仅里面会存在许多重复，而且也会出现很多不必要的字符。Hampton认为，标识语言应该是赏心悦目的，而且不是所有能赏心悦目的东西都很好，他认为能优雅到让你开发速度更快，这才是最好的。因此，从这点出发，输出同样结果的代码片段子Haml看起来应该是这样的：

#profile
  .left.column
    #date= print_date
    #address= current_user.address
  .right.column
    #email= current_user.email
    #bio= h(current_user.bio)

这看起来可能会有点奇怪，不过你不得不承认的是，这代码瘦下来好多。值得注意的是，代码中大量使用了空格来消除HTML的闭合标签，并使用CSS风格的语法来描述div的id和class，而且消除了难看的<%= %>标签。如果你比较一下两个版本字符数的大小，你会发现范例中Haml版本的字符数是HTML版本的64%。这就意味着你可以少输入36%的字符、少读36%的字符。归根到底就是少了36%的碍眼的东西。Antoine de Saint-Exupery对Haml给于了高度评价：“在没有什么可以去除，而不是什么都加不进去的时候，十全十美的目标就达到了。”

从大家对Haml的反应来看，评价褒贬不一。有不少Ruby狂热分子会把它和Python相提并论，因为它大量使用了空格缩进。然而，Hampton一行Python代码都没有写过，他只是觉得空格可以在文档中可以表示结构。他认为Haml更像YAML而不是Python，因为它更专注于文档的结构和数据的配置。

新的视点总是有自己一席之地的，DHH也同意说：“我不能肯定这符合我的口味，但我非常欣赏从另一个角度思考问题的意愿。”社区同样也表示支持态度，因为关于Haml的活动和讨论也很是热烈。Hampton拿着不断发展的社区开起玩笑说：

“在Haml的论坛上面晃我感觉总是很奇怪，我感觉我是在读大家对一门技术写的情书。;)”

Hampton认为，你只需要花20分钟就会喜欢上Haml的简洁。不过，Grigsby不同意这个观点，他认为2分钟足矣。

要了解更多关于Haml的信息，请看Grigsby的介绍和Haml网站。

查看英文原文：HAML: The Beauty of Efficiency

1. 返回顶部

   简介了？

   发表人 xu huisheng

   只看到失去了html的原貌，不知道你这样搞怎么让美工设计页面了。打算让程序员写这些吗？

   回复

2. 返回顶部

   如果没有好的IDE，太难普及了

   发表人 Kong Fanbin

   如果没有好的IDE，太难普及了
   XSLT是个挺好的东西，没有好的IDE一样不能火起来。

   回复

3. 返回顶部

   要程序员累死啊？

   发表人 lei snail

   字节是少了，可是页面设计人员看不懂啊，不是很直观，最后还要程序员转一遍，麻烦啊

   回复

4. 返回顶部

   Re: 要程序员累死啊？

   发表人 Guo Xiaogang

   我觉得这种方式其实假设了页面中数据和表现的分离。页面设计人员就不该管这些，他们写CSS就好了。
   
   不过我也觉得就少打了些字，跟<div/>的写法相比没多大区别。也许是例子太简单了吧，有时间还要仔细看看再下结论。

   回复

5. 返回顶部

   Re: 要程序员累死啊？

   发表人 夏 绪宏

   刚才看了点教程,使用了一下,还是挺不错的,不过也存在一些问题..
   简洁是简洁里,但是有的东西又被限制了..不是特别灵活,如果是别人合作的话,也的要求美工也要学习 这东西...
   有得总有失.自己权衡了..

   回复

• 更早的 >