Templating System Concepts (the evolution)
By Benjamin 'balupton' Lupton
DOWNLOAD THE SOURCE
Current Build: 16/02/2008
Read the backstory

Level 0 - Static:
Level 0 is Static, so your basic htm website, with each individual file being a template.

Level 1 - Includes:
With PHP you can split your website design into multiple files, and include them when needed.
So common parts of the website are then extracted and included where appropriate (eg. header, footer).
With pages still being split up into different files (eg. index.php, search.php).

Level 1 - Conditional:
The alternative of includes is conditions, so by using user input to figure out the desired page, we can display what is needed.
This pages are accessed like so instead: index.php?page=search

Level 2 - Shortcuts:
Level 2 uses shortcuts to display repetitive data.
This is done by using a template for a table row design, and an array for the table row data which is cycled through.

Level 3 - Population:
Level 3 expands on Level 2 by taking out the code from the template. So we have a template that is populated by data.
This is done by having a populate function that inports the template and data, and exports the populated result.

Level 4.0 - Separation:
So the next step from level 3 is separating code from design.
We want to do this as it simplifies the design and code structure, and allows for designers to work on design and programmers the code.
It is done by having many template files, where the index template file is scanned and populated with the data.

Level 4.1 - Separation (Defaults):
The problem with Level 4.0 is that we need data to have display.
Level 4.1 adds support for defaults, so that designs can run without data.
The benefit of this is that designers can then make fully functional designs based of default/test data.

Level 4.2 - Separation (Mixture):
Extending Level 4.1, we allow the ability of having the templates be a mix of code and design.
This allows designers to use the shortcuts of code within designs.

Level 5 - Dedicated Solutions (Templating Engine):
Level 5 brings forward dedications solutions, so including a system that is dedicated to templating.
The benefit of a dedicated solution is that they are well maintained and offer excessive features.
For this we are using Smarty

Level 6 - Client Side Templating (Not Fully Functional):
Before all solutions have just been server side (running on the server), where with client side, population occurs on the client (within the browser).
The benefit of this is that data there is less overhead as only things that are needed to be updated on the page are.
This means that less resources are used as common things like headers and footers are not repetively processed.
For this we are using JSmarty (A javascript port of Smarty)

Level 7 - Dual Side Templating (Seperate Installations) (Not Fully Functional):
The problem with Level 6 is that if you do not have javascript enabled, population doesn't happen.
So by using both templating engine installations (smarty + jsmarty) we are able to solve this problem.
As Smarty runs initially, and then from then on JSmarty runs client-side if applicable.

Level 8 - Dual Side Templating (Single Installation) (Not Fully Functional):
So the next step is making it so there is only one templating engine installation.
We want this as then only one then needs to be developed and maintained, as well as offering a complete uniformity between server and client side.
This is possible with the addition of Jaxer as it lets javascript run server, client and both sides.
So by using Jaxer with JSmarty we can accomplish this goal.
For this example, it must run on a Jaxer server.

Note (16/02/2008):
Unfortunately, JSmarty is still not in a position to be usable, hence the "Not Fully Functional" notices. Hopefully this project will gain more attention and reach that stage. But for the purpose of showing a concept, it still works well.