Slides of the talk I did at fronteers 2011 jam session on Oct 5th 2011. Here I will briefly introduce the mustache template engine and how to use it for front-end templating.
12. {{mustache}}
what
Made by Used by
etc...
Logic-less
Framework-agnostic
Shared templates (front/back end)
13. {{mustache}}
what
Implementations for Javascript,
Ruby, Python, PHP, C++, Clojure,
Java, Scala etc...
Simple!
Fast!! Really fast!
...but unfortunately not as fast as a neutrino
14. {{mustache}}
what
Implementations for Javascript,
Ruby, Python, PHP, C++, Clojure,
Java, Scala etc...
Simple!
Fast!! Really fast!
...but unfortunately not as fast as a neutrino
15. {{mustache}}
how
Simple! Really? Yes!
var user = { {{tag}}
first_name : “David”,
Object
last_name : “Gilmour”
}
var tpl = “<p>Hello, {{first_name}} {{last_name}}!</p>” Template
var html = Mustache.to_html(tpl, user); the magiccc
“<p>Hello, David Gilmour!</p>”
16. {{mustache}}
how
{{#inStock}}
inStock : function(){ /*...*/ return true; } ..render if true
{{/inStock}}
{{#guitars}}
guitars : [“ibanez”, “music man”, “gibson”] {{.}}
{{/guitars}}
guitars : [{ name : “music man jpx”, strings:7}, ...]
{{#guitars}}
{{name}} {{strings}}
{{^guitars}} {{/guitars}}
guitars : [] exactly! No guitars!
{{/guitars}}
to_unescape : “Me&You” {{{to_unescape}}}
20. {{mustache}}
how
wait...
...is it THAT simple?
Mustache.to_html(template, view, partials)
21. {{mustache}}
how
wait...
...is it THAT simple?
Mustache.to_html(template, view, partials)
...let’s take a look at some ‘real life’ examples
22. {{mustache}}
Fast! Really? Yes! Js is fast!
data taken from “Mustache in the Front, Mustache in the Back” talk
by Patrick Ewing - twitter developer - (@hoverbird)
23. {{mustache}}
Fast! Really? Yes! Js is fast!
Rendering time
HAML ERB {{rb}} jQuery tpl {{JS}}
data taken from “Mustache in the Front, Mustache in the Back” talk
by Patrick Ewing - twitter developer - (@hoverbird)
24. {{mustache}}
Fast! Really? Yes! Js is fast!
Rendering time
HAML ERB {{rb}} jQuery tpl {{JS}}
data taken from “Mustache in the Front, Mustache in the Back” talk
by Patrick Ewing - twitter developer - (@hoverbird)
25. {{mustache}}
Fast! Really? Yes! Js is fast!
Rendering time
HAML ERB {{rb}} jQuery tpl {{JS}}
data taken from “Mustache in the Front, Mustache in the Back” talk
by Patrick Ewing - twitter developer - (@hoverbird)