Servage Magazine

Information about YOUR hosting company – where we give you a clear picture of what we think and do!

Introduction to JadePHP

Saturday, May 17th, 2014 by Servage


There are dozens of templating engines out there, with options such as Smarty, Twig (used in the upcoming version of Drupal) and Blade (the default for Laravel) among the best known – as well as vanilla PHP, of course. Stepping away from PHP specifically, eRuby / ERB and Haml for Ruby / Ruby on Rails, and Javascript has scores of popular choices including Mustache, Handlebars, Hogan and EJS. Some have subtly different syntax, some more markedly so.

A comparison

One which differs quite significantly from most is Jade, an engine usually associated with Javascript applications – it’s supported out-of-the-box by Express for Node.js, for example. It’s Jade I’m going to look at in this article; or more specifically the PHP port JadePHP.

Most templating engines involve writing the target markup and “injecting” it with placeholders and / or basic logic – a superset, in a sense. Jade still has placeholders and logic, but also provides a shorthand for writing XML-like elements. Generally that means HTML, although you can also use it for things like RSS as well as XML itself.

In fact if you wanted to, you could just use Jade as a shorthand for HTML without taking advantage of its more “traditional” templating features.

Rather frustratingly, the code is not currently available via Composer – although it should be a simple enough task to package it up, if anyone has an hour or two. You can get it to to work, however, by cloning the repository and include‘ing or require‘ing the included autoload.php.dist (the Github repository includes Symfony’s UniversalClassLoader).

Here’s an example, adapted from the one in the project’s README, which assumes that the repository has been downloaded into a directory called jade:

 use Everzet\Jade\Dumper\PHPDumper,
 $dumper = new PHPDumper();
$dumper->registerVisitor('tag', new AutotagsVisitor());
$dumper->registerFilter('javascript', new JavaScriptFilter());
$dumper->registerFilter('cdata', new CDATAFilter());
$dumper->registerFilter('php', new PHPFilter());
$dumper->registerFilter('style', new CSSFilter());
 // Initialize parser & Jade
$parser = new Parser(new Lexer());
$jade   = new Jade($parser, $dumper);
 $template = __DIR__ . '/template.jade';
 // Parse a template (both string & file containers)
echo $jade->render($template);

Where you actually use this depends on your workflow, whether you’re using a framework, and so on. You could, perhaps, use a service such as Watchman, Guard or Resource Watcher to watch the filesystem for changes to your Jade templates, and compile them at the appropriate time during the development process.

Why use Jade?

Arguments about which templating language to use are ultimately pretty futile. Whilst you can come up with certain benchmarks about which perform better than others in certain circumstances, which ones are specifically designed for certain environments – like client vs server-side, at the end of the day the choice is often a very personal one which comes down to what you feel comfortable scripting in. I have no intention of trying to fan those flames, any more than I wish to get involved in arguments over which is “the best” programming language.

Jade’s shorthand approach won’t be for everyone. There are some who will argue that it’s easier to read, and some who will vehemently disagree. If, however, it’s an approach that you see the merit in then that’s a compelling reason to choose it.

Another reason you might decide to use Jade – apropos of a number of templating options – is if you alternate between technologies. If you often switch between, say, Node.js and PHP development then there’s some logic in keeping things consistent.

Sources for further reading

Introduction to JadePHP, 4.0 out of 5 based on 2 ratings
Categories: Guides & Tutorials


You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

No comments yet (leave a comment)

You are welcome to initiate a conversation about this blog entry.

Leave a comment

You must be logged in to post a comment.