Page Comparison

This is what the template format will look like.In programming web applications is often useful to be able to have a templating function.

This is a templating function (rather a library) that aligns with avoiding complexity, safety by design and separation of concerns.

This is how one would use such a template:

...

<div>$ID$</div><div>$Life$</div>

$ characters can be represented by a double string. We can pass in an array.

What are the advantages:

...

Developers don’t need to think about whether or not the data they are putting in can have special characters - which is common source of bugs in web applications. The templating library will always do it.

...

The ‘library’ can be expressed in a few lines of Javascript - so no big mystery on how it works.

...

There are no fancy callback features to tempt developers to write complicated code.

...

There is no caching - but we don’t have 600 extra lines of unnecessary Javascript and caching takes extra memory and is probably premature optimization and our simple code will be faster anyway.

...

Putting the responsibility elsewhere for handling logic in absence of data etc. Encouraging separation of concerns.

var MAINtemplate=
`<p>$Name$ has $$$Amount$ in their bank account.</p>$
 <p>----</p>
`;

function MAINrun(){
   var Body = document.querySelector('body');
   var Data = [{Amount : 55, Name : " Fred " }, {Amount : 45 , Name : "Mary"}];
   Body.innerHTML = TEMexpand(Data, MAINtemplate);
}

READYevent(MAINrun);

This code would produce:

Fred has $55 in their bank account.
----
Mary has $45 in their bank account.
----

TEMexpand is implemented couple of dozen lines of code. You can get the source here.

So why use this instead of a fully featured templating system like Mustache?