Les moteurs de templates

Transcription

Les moteurs de templates
Les moteurs de templates
Les principaux moteurs de templates
php
raintpl
smarty
twig
mustache
savant3
talus'tpl
...
1/15
Utilité des moteurs de templates
Avantages :
Séparer le traitement de l'affichage
Permettre aux designers de développer rapidement des
gabarits sans spécialement connaître le langage utilisé
Minimiser le code et le rendre plus clair
Inconvénients
Un peu plus lent à exécuter (cache obligatoire)
Casse la structure xhtml
...
2/15
Cas pratique : TWIG
(http://twig.sensiolabs.org)
initialisation de la librairie (après téléchargment de l'archive)
<?php
require_once("twig/lib/Twig/Autoloader.php");
Twig_Autoloader::register();
$loader = new Twig_Loader_Filesystem("templates");
$twig = new Twig_Environment($loader, array("cache" => false));
?>
D'autres options disponibles : http://twig.sensiolabs.org
/doc/api.html#environment-options
3/15
Twig : démonstration
Créez un nouveau fichier templates/demo.html :
Démonstration de l'utilisation de {{ moteur_templates }}.
Ajouter sous l'initialisation de Twig :
echo $twig->render("demo.html", array("moteur_templates" => "Twig"));
Résultat :
Démonstration de l'utilisation de Twig.
4/15
Twig : les filtres
Twig inclut par défaut quelques filtres, vous permettant de
modifier un peu l'affichage de vos valeurs :
{{ ma_variable|le_filtre }}
Ou
{% filter le_filtre %}
Mon texte ... {{ ma_variable }}
{% endfilter %}
D'autres :
capitalize
date
length
upper/lower/trim/nl2br
http://twig.sensiolabs.org/doc/filters/index.html
5/15
Les conditions dans Twig
{% if nb_articles >= 2 %}
Il y a {{ nb_articles }} articles sur le blog.
{% elseif nb_articles == 1 %}
Il n'y a pour l'instant qu'un seul article sur le blog.
{% else %}
Il n'y a encore aucun article sur ce blog. Reviens plus tard.
{% endif %}
{% if pseudo is defined %}
Vous êtes connecté.
{% endif %}
{% if pseudo is defined and pseudo is not empty%}
Bonjour {{ pseudo }}.
{% endif %}
6/15
Twig : les tableaux
Côté PHP :
<?php
echo $twig->render("articles.html", array(
"articles" => array(
array(
"titre" => "Titre 1",
"url" => "titre-1",
"img" => "http://abc.fr/image1.jpg",
"tags" => array("Tag 1", "Tag 2", "Tag 3")
),
array(
"titre" => "Titre 2",
"url" => "titre-2",
"img" => "http://abc.fr/image2.jpg",
"tags" => array("Tag 4", "Tag 5")
),
array(
"titre" => "Titre 3",
"url" => "titre-3",
"img" => "http://abc.fr/image3.jpg",
"tags" => array("Tag 6", "Tag 7", "Tag 8")
)
)
));
?>
7/15
Twig : les tableaux
Côté Twig :
{% if articles|length > 0 %}
{% for each in articles %}
<article class="article">
<div class="icone">
<img src="{{ each.img }}" alt="{{ each.img }}">
</div>
<div class="content">
<header>
<h2><a href="{{ each.url }}">{{ each.titre }}</a></h2>
</header>
<p>
{% for tag in each.tags %}
<strong>{{ tag }}</strong>
{% endfor %}
</p>
</div>
</article>
{% endfor %}
{% else %}
<b>Aucun article pour l'instant.</b>
{% endif %}
8/15
Twig : les includes
Possibilité d'inclure des templates dans des templates :
{% include "menu.html" %}
9/15
Twig : héritage
<!DOCTYPE html>
<html>
<head>
{% block head %}
<link rel="stylesheet" href="style.css">
<title>{% block title %}{% endblock %} - My Webpage</title>
{% endblock %}
</head>
<body>
<div id="content">{% block content %}{% endblock %}</div>
<div id="footer">
{% block footer %}
© Copyright 2011 by <a href="http://domain.invalid/">you</a>.
{% endblock %}
</div>
</body>
</html>
10/15
Twig : héritage
{% extends "base.html" %}
{% block title %}Index{% endblock %}
{% block head %}
{{ parent() }}
<style type="text/css">
.important { color: #336699; }
</style>
{% endblock %}
{% block content %}
<h1>Index</h1>
<p class="important">
Welcome to my awesome homepage.
</p>
{% endblock %}
11/15
Twig : les macros
Dans un fichier forms.html :
{% macro input(name, value, type, size) %}
<input name="{{ name }}" <br="" type="{{ type|default('text') }}">
value="{{ value|e }}" size="{{ size|default(20) }}" />
{% endmacro %}
Importation des macros dans un template :
{% import "forms.html" as forms %}
<p>{{ forms.input('username') }}</p>
Une macro en particulier :
{% from 'forms.html' import input as input_field %}
<dl>
<dt>Username</dt>
<dd>{{ input_field('username') }}</dd>
<dt>Password</dt>
<dd>{{ input_field('password', '', 'password') }}</dd>
</dl>
12/15
Twig : les expressions
Possibilité d'utiliser des expressions un peu partout :
{%
{%
{{
{#
{{
set greeting = 'Hello' %}
set name = 'Fabien' %}
greeting ~ name|lower }} {# Hello fabien #}
use parenthesis to change precedence #}
(greeting ~ name)|lower }} {# hello fabien #}
Mais aussi :
des opérateurs mathématiques
des opérateurs logiques
des opérateurs de contenu
...
http://twig.sensiolabs.org/pdf/Twig.pdf
13/15
Comparaisons boucles
Résumé (boucles)
Test
tot. tempstot. mémoiretaille libr.
php 5.4.4-14+deb7u52086 μs 40.63 KB 4 KB
raintpl 2.7.0
5110 μs 345.8 KB 37 KB
twig 1.5.1
19097 μs 844.88 KB 647 KB
smarty 3.1.11
20112 μs 1.51 MB
1100 KB
14/15
Comparaisons affectations
Résumé (affectation)
Test
tot. tempstot. mémoiretaille libr.
php 5.4.4-14+deb7u52001 μs 12.16 KB 4 KB
raintpl 2.7.0
5113 μs 321.86 KB 37 KB
twig 1.5.1
17671 μs 844.86 KB 647 KB
smarty 3.1.11
20411 μs 1.52 MB
1100 KB
15/15

Documents pareils