...
Code Block |
---|
function TEMconvertString(V){ if (!V) { return ''} else { return V.toString(); } } function TEMexpandLine(Tokens, Row, Array){ for (var i =0; i < Tokens.length-1; i+=2){ Array.push(Tokens[i]); Array.push(TEMconvertString(Row[Tokens[i+1]]) .replaceAll("&", "&") .replaceAll("<", "<") .replaceAll(">", ">")) } Array.push(Tokens[Tokens.length-1]); } function TEMexpand(Data, Template){ var Array = []; var Tokens = Template.replaceAll("$$", "_FuNkYDolARAM").split('$'); for (var i =0; i < Data.length; i++){ TEMexpandLine(Tokens, Data[i], Array); } return Array.join('').replaceAll("_FuNkYDolARAM", "$"); } |
What are the advantages compared to using a more fully featured templating system like Mustache?
...
The
...
code
...
does
...
Zero fancy features - nothing whatsoever resembling a language with if conditionals and so on. Therefore zero danger of the templating library becoming a crappy language.
There are no fancy callback features to tempt developers to write complicated code. It’s only going to work with an array of data.
No caching or other unnecessary pre-mature optimizations - simple code will be faster anyway.
...
Putting the responsibility elsewhere for handling logic in absence of data etc. Encouraging separation of concerns.
The code does use some techniques which are worth understanding:
We use an array of string strings and concatenate them at the end for performance.
We escape characters like & < and > to translate into HTML entities so that data can be not mis-interpreted and HTML markup.
We use a magic token '
_FuNkYDolARAM
' to handle the convention of allows a double $$ escape sequence to represent a $ character.
...