对 Jade 的一些看法

作为 Express 的默认模版,Jade 进入了我的视野,如同习惯了 Javascript 的语法,再见到 Coffescript 时的惊艳。优雅、简单是对 Jade 的第一印象,在 Github 上拥有4K的Star足见其受欢迎的程度。

我在刚开发 Noderce 时就用上了 Jade,经过一番学习使用起来倒没有什么问题,但使用 Jade 这个过程并不像想象中的愉快,我遇到了一些的问题,并且耗费在写HTML上的时间有所增加。在之后的 Node.js 项目中我改用 EJS,非常的舒适习惯、效率很高。

我整理了自己使用 Jade 后的一些看法,希望对大家在选择模版引擎时有所帮助。

###不能减少你的输入

这是 Jade 官网给的示例

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
doctype 5
html(lang="en")
head
title= pageTitle
script(type='text/javascript')
if (foo) {
bar()
}
body
h1 Jade - node template engine
#container
if youAreUsingJade
p You are amazing
else
p Get on it!

太棒了,相对手写HTML减少了大量的输入,并且漂亮、缩进清晰、层级明了。但是,似乎用 zencoding 的话,输入量应该是在一个层级,仅看 HTML 部分的话,使用 zencoding 输入量更少。我只需要输入以下内容,以及少许的光标移动

1
2
3
4
5
html:5
script
h1
#container
p

在逻辑方面, Jade 做得不错,不需要<%%>这样的额外的输入。但总体来说,Jade 并不能降低输入量。

###可移植性低

当你的项目使用了一些别的地方拷贝过来的HTML代码时,你需要使用 html2jade 这样的工具来进行转换后才能使用。

###调试困难

如果页面中某部分出了问题,首先前端会通过 firebug 定位问题出在哪里,如果是普通模板,直接就找到源码中的目标位置了,如果使用了此类模板,好吧,先用脑子翻译成这种模板,然后再去找目标位置,如果页面复杂,这种转换需要的时间也就更长。via

###性能低

WEB模板jade、ejs、handlebars 万行代码解释效率比较,jade完败

这篇文章提供的效率比较结果(平均消耗时间,约数)
jade 287ms > ejs 43ms > handlebars 28ms

性能不应该成为不使用 Jade 的原因,但快一点总是好的,对吧?