Jade - Haml killer for nodejs

Last night I open sourced my latest project Jade, a template engine for node, focusing on readability, error handling and performance. Jade spawned from several needs, first I was tired of debugging poor JavaScript template implementations, or finding work-arounds for common issues, secondly I love haml’s syntax, however I feel it could be revamped to provide a more enjoyable experience, and lastly … I like parsers!

Examples

So what does this so called “Jade” look like? like this:

!!! 5
html(lang="en")
  head
    title= pageTitle
    :javascript
      | if (foo) {
      |    bar()
      | }
  body
    h1 Jade - node template engine
    #container
      - if (youAreUsingJade)
        p You are amazing
      - else
        p Get on it!

If you are at all familiar with Haml you will see tons of similarities, however with a few important changes. First of all inverting the responsibility of whitespace we can remove the % tag prefix, leading words are now simply tags, and text blocks now contain a margin as indicated by the pipe |. I am sure people will have varying opinions on this, but I find it much easier to read, and more enjoyable to type since your main focus is building a layout, not writing text blocks.

Features

Below are some of the highlights of 0.0.1:

  • high performance parser
  • great readability
  • code is escaped by default for security
  • contextual error reporting at compile & run time
  • executable for compiling jade templates via the command line
  • html 5 mode (using the !!! 5 doctype)
  • optional memory caching
  • combine dynamic and static tag classes
  • no tag prefix
  • filters
    • :sass
    • :markdown
    • :cdata
    • :javascript

Implementations

As of this moment JavaScript (node specifically) is the only Jade implementation, however as with Haml this could easily be ported to other host languages, and I encourage it greatly! Even if you are not a JavaScript guy feel free to try it out, and implement it in your language of choice :)

More Information

Head over to the Github repo, or visit the Jade site for additional examples, installation guides and more.

Notes

  1. tenkao reblogged this from tjholowaychuk
  2. 514qc reblogged this from tjholowaychuk
  3. messel reblogged this from tjholowaychuk
  4. tjholowaychuk posted this