Template parser

This site uses cookies. By continuing to browse this site, you are agreeing to our Cookie Policy.

  • Wie kent het niet HTML en PHP code in één bestand, en wie heeft nog nooit de opmerking naar zijn hoofd gehad dat hij / zij dat niet moet doen. Veel volgens mij en ik heb het zelf ook al een paar keer gezegd. Bij deze zeg ik het nog een keer:

    PHP & HTML indien mogelijk niet in het zelfde bestand zetten!

    Maar waarom niet eigenlijk? Aller eerst is het on overzichtelijk, je code wordt er slordig door en als je twee maanden later naar je codering kijkt ben je wel even bezig met het uitzoeken van deze code. Het herhalen van bijvoorbeeld een <div> voor een foutmelding blijf je meerdere keren herhalen terwijl dit echt totaal niet nodig is.

    Maar wat is nu een template parser?

    Een template parser is niets meer en niets minder dan een class die een html file opent, bekijkt en daar waar aangegeven variabels herplaatst met de ingegeven data. Daarnaast zorgt het uiteraard voor overzichtelijkheid. Er zijn meerdere soorten template parsers beschikbaar en meerdere soorten toepassingen ervan waarvan de meeste bekende smarty is.

    Smarty

    Smarty is een template engine die begonnen is als zij project van php.net website maar als snel uitgroeide naar zijn eigen naam en project. Echter over de loop der jaren is de code nooit volledig herzien waar de code lomp en traag wordt als het veelvuldig in een website gebruikt wordt.

    Een voorbeeld van smarty in php:

    PHP Source Code

    1. <?php
    2. require_once('lib/smarty.class.php');
    3. $smarty = new Smarty();
    4. $smarty->assign('variable', 'Hello world!');
    5. $smarty->render('index.tpl');


    Niks meer en niks minder heb je nodig om een template engine up and running te krijgen bij smarty. Door het simpele gebruik kan je al snel aan de slag gaan met smarty. Maar hoe ziet een html bestand er dan uit?

    Het html bestand wordt van het moment dat je smarty gebruikt een tpl bestand genoemd. In dit bestand zit de html code van je website met smarty variables. Maar hoe zit dat er dan uit?

    Source Code

    1. ​{include 'header.tpl'}
    2. <div class="content">
    3. <p>{$variable}</p>
    4. </div>
    5. {include 'footer.tpl'}


    Er worden in bovengenoemde code verschillende smarty elementen toegepast:
    1. ​Er wordt een ander tpl bestand geinclude doormiddel van {include} deze werkt hetzelfde als een require_once als in PHP. Het bestand wat wordt aangegeven wordt geinclude in je tpl bestand en zo kan je dus losse stukken HTML
    2. Weet je nog het eerste stuk PHP code waar in $smarty->assign('variable', 'Hello World!'); wordt aangegeven. Het eerste gedeelte na het assign stuk geeft wat de naam is in de tpl variabel en de 2de parameter is de data die de variabel bevat doormiddel van {$variable} weergeef je de data die meehebt gegeven met de assign.
    Twig

    Daarnaast is de afgelopen jaren een tweede veel belovende template engine ontstaan genaamd twig. Origineel gemaakt voor het gebruik in het symfony framework heeft de template engine zijn weg gebaand als een stand alone versie die iedereen kan gebruiken. En weet je wat? Het is nog een populaire template engine ook!

    Maar waarom dan? In de programmeer wereld zie je sinds PHP 5 de verschuiving van procedueel programmering heel snel verschuiven naar OO programmering. Dit is wat de meeste programmeer talen doen en daar zijn programmeurs meestal het meest blij mee. Maar een template engine die het idee van OO bevat... Die.. was er nog niet tot twig.

    Twig maakt gebruik van blocks / inheritences wat er voor zorgt dat een html template bestand heel dynamisch kan worden. Maar hoe zit de PHP codering er dan in het simpelst uit. Nou iets moeilijker als smarty maar nog steeds vrij simpel:

    PHP Source Code

    1. <?php
    2. require_once 'lib/Autoloader.php';
    3. Twig_Autoloader::register();
    4. $loader = new Twig_Loader_Filesystem('/templates');
    5. $twig = new Twig_Environment($loader, array(
    6. 'cache' => '/path/to/compilation_cache',
    7. ));
    8. $template = $twig->loadTemplate('index.html');
    9. echo $template->render(array('variable' => 'Hello World!'));
    Display All


    Iets meer regels maar dan krijg je ook wat zeggen wat dan maar :). Twig is met de huidige OO standaarden gemaakt en dat kun je ook wel zien omdat je het een en ander aan moeten roepen voor dat je twig actief hebt. Echter het voordeel van Twig is dat het licht gebouwd is en voor snel. De variabels doe je in dit geval samen met de render methode meesturen.

    En het html bestand? Die je noem je gewoon .html met als voorbeeld de volgende inhoud:

    Source Code

    1. ​{% extends "base.html" %}
    2. {% block head %}
    3. <style type="text/css">
    4. .important { color: #336699; }
    5. </style>
    6. {% endblock %}
    7. {% block content %}
    8. <h1>Index</h1>
    9. <p class="important">
    10. {{ variable }}
    11. </p>
    12. {% endblock %}
    Display All


    Hier zie je wel wat meer code en ook totaal anders. Hier komt het block systeem goed zichtbaar. Zal ik gewoon stap voor stap uitleggen wat wat is?
    • de extends geeft aan dat je een html bestand als basis wilt gebruiken en dat je deze wilt uitbreiden met de html code van hierboven genoemde programmering.
    • de block [naam] geeft aan welk block je in "base.html" wilt vervangen in dat document. Alle code tot endblock zal in het base.html document worden verwerkt.
    • {{ variable }} is niks meer en niks minder dan het weergeven van de meegegeven variabel die we in de render methode hebben aangegeven.
    • ​ ​​
    Ik hoop dat jullie hiermee in de richting worden bewogen van het gebruik van een template parser, en uiteraard mocht je vragen hebben de PM staat altijd open :D.

    1,005 times read

Comments 5

  • FangorN -

    De toepassing van wat voor techniek / technische oplossing dan ook zou een weloverwogen (en ondrebouwde) keuze moeten zijn. Vraag je af waarom je een template engine (zonder meer?) zou willen gebruiken. Template engines zorgen voor overhead en introduceren een extra laag van abstractie in je applicatie. Zoals iemand mij ooit zei "PHP is ook een template engine". Ik mis argumentatie (voor en tegen) het gebruik van template engines/parsers. En als het enkel is omdat je designers bang zijn voor PHP... Tijd voor een crash course.

    • Patrick -

      En dat is het kortzichtigheid van menig mens online wat nou als je eigen bedrijf faalt en je bij een web company gaat werken ga je dan ook zeggen van ik doe het design / slice / programmering en alles wel? nee hier wordt ook gekozen om designers alles te laten designen en eventueel te slicen. Die willen niks met PHP te maken hebben. Daarnaast overhead, geintje zeker die 0.0001 extra seconde met cached template zorgen echt niet voor vertraging in je website. Weloverwogen keuze? Tuurlijk je hebt altijd mensen die php boven een parser kiezen maar on overzichtelijkheid is ook een prio daarnaast he.. ieder zijn keus :)

    • FangorN -

      Geen gebruik maken van een template engine === kortzichtig? Hmm... Zelf ben ik een groot voorstander van overzichtelijke code / templates en heb al menig jaar gewerkt bij een internetbureau. Daar was in hun intern ontwikkeld CMS gekozen voor een templatesysteem in native PHP, waarbij dus geen alternatieve syntax {tussen accolades} of <!-- andere alternatieve blokken --> aangeleerd hoefde te worden. Om een of andere reden lijkt het al dan niet gebruiken van een template systeem onwijs gevoelig te liggen. Desalniettemin lijkt mij dat de keuze voor wel of niet gebruiken van zo'n oplossing niet staat of valt met de afkeer (en simpelweg onwil) van designers om enkele beginselen van PHP te leren. Sure, programmeurs en designers doen verschillende dingen, maar hun werk is tegelijkertijd onlosmakelijk met elkaar verbonden. Het is niet noodzakelijk om hier een laag (muur) tussen te metselen in de vorm van een template engine. Te meer omdat dit ook overhead in code introduceert en ook in grote mate bepaalt hoe je je code moet schrijven. EDIT: en als we niet zonder zouden kunnen, waarom is zo'n functionaliteit dan niet (allang) in PHP geintegreerd? spoiler: omdat het simpelweg niet altijd DE oplossing is

  • Victor -

    Heb eigenlijk nog nooit met een template parser gewerkt, maar nu ik jouw blog zo lees denk ik dat er het toch maar even ga uitzoeken allemaal. :)

  • K.Rens -

    Cool, ik had nog niet van Twig gehoord. Super bedankt om dit te delen!