Optimiser le développement web avec Scriban dans Sitecore SXA

mis à jour le 22-08-2024

Scriban, un langage de template open source développé spécifiquement pour Sitecore Experience Accelerator (SXA), révolutionne la manière dont les développeurs et designers créent et gèrent les sites Web. En combinant une syntaxe expressive avec une intégration profonde dans SXA, Scriban facilite la création de modèles de pages et de composants dynamiques. Il permet ainsi une personnalisation avancée sans complexité de codage backend.

À travers cet article, nous explorerons en détail les fonctionnalités clés de Scriban, démontrant comment il simplifie le développement tout en offrant aux développeurs et designers une liberté créative sans précédent. Que vous soyez un développeur expérimenté cherchant à optimiser vos workflows ou un concepteur technique aspirant à intégrer plus d’interactivité dans vos projets, vous découvrirez comment Scriban peut transformer votre approche de la construction de sites web sur la plateforme Sitecore.

Qu’est-ce que Scriban ?

Scriban est un langage de modèle open source spécialement développé par Sitecore pour être utilisé avec Sitecore Experience Accelerator (SXA). SXA enrichit la plateforme Sitecore avec des outils qui simplifient la création et la gestion de sites Web. Ce langage a été conçu pour répondre spécifiquement aux exigences uniques de SXA, offrant une intégration profonde avec ses fonctionnalités modulaires et ses workflows de développement.

La syntaxe de Scriban est simple et expressive, ce qui facilite la création de modèles de pages et de composants dans SXA. Il permet aux développeurs et aux concepteurs de construire des modèles réutilisables et dynamiques en utilisant des variables, des boucles, des conditions et d’autres fonctionnalités avancées. Cela contraste avec d’autres moteurs de templates qui peuvent requérir une syntaxe plus complexe ou une configuration supplémentaire pour atteindre une intégration similaire avec des systèmes de gestion de contenu.

Un des principaux avantages de Scriban par rapport à d’autres moteurs de templates est sa capacité à personnaliser l’apparence et le comportement des composants SXA sans nécessiter de code backend complexe. Cette caractéristique rend Scriban idéalement adapté pour les environnements SXA où la rapidité et la flexibilité du développement frontend sont prioritaires. Les développeurs peuvent donc implémenter des modifications visuelles et fonctionnelles rapidement et de manière plus intuitive, ce qui simplifie le processus de développement et améliore l’expérience globale de création de contenu.

En résumé, Scriban pour Sitecore SXA offre une manière efficace et flexible de créer des modèles de sites Web riches et interactifs sur la plateforme Sitecore, en simplifiant le processus de développement et en offrant une meilleure expérience de création de contenu.

Quelques points clés sur l’utilisation de Scriban dans Sitecore SXA

Syntaxe simple et expressive : Scriban utilise une syntaxe plus légère et plus intuitive par rapport à Razor, ce qui facilite la création et la maintenance des modèles.
Réutilisation des Composants : SXA utilise des composants modulaires appelés « rendering variants » qui définissent la façon dont les données sont présentées. Avec Scriban, vous pouvez personnaliser ces rendering variants de manière plus flexible.
Personnalisation dynamique : Scriban facilite la personnalisation dynamique des modèles en utilisant des variables, des boucles, des conditions et d’autres fonctionnalités avancées, permettant ainsi de créer des expériences utilisateur riches et interactives.
Performances Améliorées : Scriban est conçu pour offrir des performances améliorées par rapport à Razor, grâce à une évaluation de modèle plus rapide.
Documentation complète : Il est accompagné d’une documentation complète et de ressources de support, ce qui facilite son adoption et sa prise en main par les développeurs.
Flexibilité : Scriban offre une grande flexibilité, permettant aux développeurs de personnaliser les modèles selon les besoins spécifiques de leur projet, sans être limités par des contraintes techniques.

Focus sur les performances de Scriban

Scriban se distingue non seulement par sa flexibilité et sa facilité d’utilisation mais également par ses performances optimisées, ce qui en fait un choix privilégié pour les développeurs travaillant sur la plateforme Sitecore SXA. Voici une exploration détaillée des aspects de performance de Scriban, soutenue par des données et des comparaisons techniques pertinentes.

Évaluation rapide des modèles

Scriban a été conçu pour optimiser la vitesse d’exécution des templates. Grâce à son moteur de rendu léger et son interpréteur efficace, Scriban traite les templates à une vitesse significativement plus élevée que d’autres moteurs de templates, tels que Razor. Dans des benchmarks internes, Scriban a montré une amélioration de performance de 20% à 30% dans l’évaluation des modèles par rapport à Razor. Cette performance est principalement due à la compilation à la volée des templates en un format intermédiaire qui est ensuite exécuté très rapidement.

Optimisation de la charge serveur

Scriban réduit également la charge sur le serveur. En minimisant la nécessité d’exécuter des scripts backend complexes pour chaque requête, il diminue le temps de réponse global du serveur. Cette réduction est cruciale pour les sites à trafic élevé, où chaque milliseconde de retard peut affecter l’expérience utilisateur et la satisfaction globale. C’est également un bon point pour améliorer l’impact environnemental des solutions web !

Gestion efficace de la mémoire

Le moteur Scriban est également conçu pour être économique en termes d’utilisation de la mémoire. En utilisant des techniques de gestion de mémoire plus avancées, comme le pooling d’objets et le caching intelligent des résultats de template, Scriban garantit que les ressources sont utilisées de manière optimale, ce qui est essentiel pour maintenir la stabilité et la performance du système sous des charges élevées.

Scalabilité et adaptabilité

Enfin, la légèreté de Scriban joue un rôle crucial dans sa capacité à scaler avec l’application. Que ce soit pour de petits sites ou pour des déploiements à grande échelle, Scriban maintient une consistance de performance, permettant aux entreprises de grandir sans se heurter à des limitations de performance liées au moteur de template.

Grâce à ces aspects, Scriban s’affirme comme une solution de choix pour les décideurs techniques qui cherchent à optimiser la performance des applications web. En intégrant Scriban dans leurs projets SXA, les entreprises peuvent non seulement accélérer le développement et la mise en œuvre de nouvelles fonctionnalités mais aussi garantir une meilleure réactivité et une plus grande satisfaction des utilisateurs finaux. Ces avantages font de Scriban un investissement stratégique pour tout projet Sitecore SXA.

Exemple d’utilisation de Scriban

Supposons que vous ayez un composant de carte sur votre site Web et que vous souhaitiez créer différents rendus de variantes de carte. Voici comment vous pouvez le faire avec Scriban :

Créez une nouvelle variante pour votre composant de carte dans Sitecore SXA.
Dans l’onglet « Variants« , sélectionnez « Scriban » comme moteur de modèle.
Dans l’éditeur de modèle Scriban, vous pouvez écrire votre code Scriban pour définir le rendu de la variante. Voici un exemple :

exemple scriban

exemple scriban sitecore

Dans cet exemple :

Les champs sont remplacés dynamiquement par les valeurs contribuées (Title, Description, Image, Url, etc.)
Nous vérifions si le paramètre showImage est défini dans les paramètres du composant. Si c’est le cas, nous affichons l’image de la carte avec le titre, la description et un bouton « Learn more ».
Si le paramètre showImage n’est pas défini ou s’il est faux, nous affichons simplement le titre, la description et le bouton « Learn more » sans l’image.

Ainsi, selon les paramètres que vous définissez pour chaque instance de composant, vous pouvez contrôler dynamiquement le rendu de votre composant de carte à l’aide de Scriban dans Sitecore SXA.

Liste des principaux objets et fonctions disponibles dans Scriban

La liste des principaux objets et fonctions disponibles dans Scriban, spécialement pour Sitecore SXA, est assez riche et permet une grande variété d’usages dans les templates. Voici les éléments les plus notables :

Objets Intégrés

i_item – Représente l’élément Sitecore courant.
i_context_item – Pointe vers l’élément contextuel de Sitecore, souvent utilisé pour des informations de page.
i_datasource – Fournit l’accès à l’élément source de données configuré pour un composant.
i_site – Contient des informations sur le site Sitecore actuel.

Fonctions Communes

field – Récupère la valeur d’un champ de l’élément Sitecore.
query et fast_query – Permettent de réaliser des requêtes pour extraire des données depuis la base de données de Sitecore.
link – Génère un lien URL à partir d’un élément Sitecore.

Fonctions de Manipulation de Texte

capitalize – Met en majuscule la première lettre de chaque mot dans une chaîne de caractères.
format – Formate des chaînes de caractères, des dates, ou des nombres selon un modèle spécifié.
html_encode et url_encode – Encodent des chaînes pour l’utilisation dans du HTML ou des URL, respectivement.

Fonctions de Gestion des Collections

add – Ajoute un élément à un tableau.
remove – Supprime un élément d’un tableau.
where – Filtre une collection basée sur une condition spécifiée.

Fonctions de Date et de Temps

now – Retourne la date et l’heure actuelles.
add_days – Ajoute un nombre spécifié de jours à une date.

Fonctions de Condition et de Boucle

if, else – Structures de contrôle pour tester des conditions.
for – Boucle sur une collection ou une plage de nombres.

Fonctions Spécifiques SXA

render_variant – Utilisé pour rendre une variante de rendu SXA.
edit_frame – Utilisé pour intégrer des fonctionnalités d’édition SXA dans le rendu.

Ces objets et fonctions permettent aux développeurs de construire des templates très dynamiques et interactifs en utilisant Scriban dans l’environnement Sitecore SXA. Ils offrent une flexibilité considérable pour la personnalisation du contenu et l’affichage, en adhérant aux meilleures pratiques de développement moderne sur Sitecore.

Pour aller plus loin, la liste exhaustive des objets et des fonctions disponibles est détaillée ici :