Upload
karan-prabu
View
520
Download
3
Tags:
Embed Size (px)
DESCRIPTION
An introduction to Javascript Template Engine
Citation preview
Javascript Template Engine
PrabhakaranUX Developer, Reportbee
Executive Member, RIA-RUI Society
Javascript Template Engine?
Javascript Template Engine?
Output = Template( input, data )
Input Data
Output
Why & When to use?
• Decouple HTML and JS• Code maintainability• For large projects
Why & When to use?
• When you think you are JS Ninja• When you need to work on your code again • Good value for your resume• Follow the trend
Client-side Templates
• Mustache.js• Handlebars.js• EJS• Underscore.js• JsRender• Hogan.js by Twitter• Dust.js by Linkedin• jQuery templates• etc, etc…
Server-side Templates
• Jade• Slim• etc, etc…
Templates Type
• Logical templates• Logicless templates
Logical Templates
Logicless Templates
Choosing Right Template
• Speed• Logic or Logicless• Pre-compilation• Active development• Community support• File size• Client or Server side
Mustache
Handlebars?
• Has advanced features and can satisfy almost all kinds of requirement
• Has most active community• Its a logicless templating engine• Lot of frameworks use Handlebars by default
Handlebars
• Expressions• Data or context• Compiler• Block helpers• Partials
Expressions
Data
Compile
Block Helper
Get hands dirty
( Check sample.html )