Meta Refresh 2014

On the construction of user interface on the web

Aseem Agarwal


A template system for your front-end code

Submitted Nov 19, 2013

The main agenda of the talk is to dig deep into using a template engine for your front end code.
The talk will cover many important things

  1. Why do you need a template system ?
  2. How it helps in increasing performance.?
  3. The different template engines and how they are used?
  4. How to design a system according to your needs.?


With the widespread use of MVC architecture and a shift of presentation logic from server to client, more emphasis is now given towards separating presentation markup from the actual logic. There are two direct benefits to such an approach

  1. Code reusability: You are essentially creating patterns for the data being used repetitively.
  2. A clear interface between the designers and the developers: Designers have a set of fixed and clearly mentioned conventions which are more easy to follow and are intuitive.
    The main challenges while designing a template system is how to keep it separate from the data model logic and at the same time make it flexible to use for the designer.

The talk is going to cover those challenges by exploring example of companies like tumblr,shopify who are already using it since that is the best place to learn. Template engines like handlebars, liquid, mustache will be discussed in brief in terms of what important features they provide over others.

Speaker bio

Iam a senior software engineer at Genwi. At genwi we are developing hybrid apps (IOS, Android, HTML5) targeted towards publishing world where design (written in HTML,CSS,JS) is decoupled from the actual code to run the apps. As such we are regularly making optimisations to improve the structure of our front end code so that we can have a more smooth and quick turnaround of new apps.
Also, Iam a blogger and I blog regularly to keep my writing skills in good shape and an aspiring speaker towards sharing my thoughts,ideas and experiences.


{{ gettext('Login to leave a comment') }}

{{ gettext('Post a comment…') }}
{{ gettext('New comment') }}
{{ formTitle }}

{{ errorMsg }}

{{ gettext('No comments posted yet') }}

Hosted by

Meta Refresh is an umbrella forum for conversations about different aspects of design and product including: UX and interaction design CMS, content management, publishing and content marketing Information architecture more