Optimizing web development with Scriban in Sitecore SXA

Optimizing web development with Scriban in Sitecore SXA

Scriban, an open source template language developed specifically for Sitecore Experience Accelerator (SXA), revolutionizes the way developers and designers create and manage websites. By combining expressive syntax with deep integration into SXA, Scriban facilitates the creation of dynamic page templates and components. This enables advanced customization without the complexity of back-end coding.

In this article, we’ll explore Scriban’s key features in detail, demonstrating how it simplifies development while offering developers and designers unprecedented creative freedom. Whether you’re an experienced developer looking to optimize your workflows or a technical designer aspiring to integrate more interactivity into your projects, you’ll discover how Scriban can transform your approach to building websites on the Sitecore platform.

 

What is Scriban?

Scriban is an open source template language specially developed by Sitecore for use with Sitecore Experience Accelerator (SXA). SXA enhances the Sitecore platform with tools that simplify website creation and management. This language has been designed specifically to meet SXA’s unique requirements, offering deep integration with its modular functionality and development workflows.

Scriban’s syntax is simple and expressive, making it easy to create page templates and components in SXA. It enables developers and designers to build dynamic, reusable templates using variables, loops, conditions and other advanced features. This contrasts with other template engines, which may require more complex syntax or additional configuration to achieve similar integration with content management systems.

One of Scriban’s key advantages over other template engines is its ability to customize the appearance and behavior of SXA components without the need for complex backend code. This feature makes Scriban ideally suited to SXA environments where speed and flexibility of front-end development are priorities. Developers can therefore implement visual and functional changes quickly and more intuitively, simplifying the development process and improving the overall content creation experience.

In summary, Scriban for Sitecore SXA offers an efficient and flexible way to create rich, interactive website templates on the Sitecore platform, simplifying the development process and providing a better content creation experience.

 

Some key points on using Scriban in Sitecore SXA

• Simple, expressive syntax: Scriban uses a lighter, more intuitive syntax than Razor, making it easier to create and maintain models.
• Component reuse: SXA uses modular components called “rendering variants” that define how data is presented. With Scriban, you can customize these rendering variants more flexibly.
• Dynamic customization: Scriban facilitates dynamic model customization using variables, loops, conditions and other advanced features, enabling you to create rich, interactive user experiences.
• Improved performance: Scriban is designed to offer improved performance over Razor, thanks to faster model evaluation.
• Comprehensive documentation: It comes with full documentation and support resources, making it easy for developers to adopt and get to grips with.
• Flexibility: Scriban offers a high degree of flexibility, enabling developers to customize models according to the specific needs of their project, without being limited by technical constraints.

 

Focus on Scriban performance

Scriban stands out not only for its flexibility and ease of use, but also for its optimized performance, making it a preferred choice for developers working on the Sitecore SXA platform. Here’s a detailed exploration of Scriban’s performance aspects, supported by relevant data and technical comparisons.

 

Fast template evaluation

Scriban has been designed to optimize template execution speed. Thanks to its lightweight rendering engine and efficient interpreter, Scriban processes templates at a significantly higher speed than other template engines, such as Razor. In internal benchmarks, Scriban showed a performance improvement of 20% to 30% in template evaluation compared to Razor. This performance is mainly due to the on-the-fly compilation of templates into an intermediate format which is then executed very quickly.

Optimized server load

Scriban also reduces the load on the server. By minimizing the need to execute complex backend scripts for each request, it reduces overall server response time. This reduction is crucial for high-traffic sites, where every millisecond of delay can affect user experience and overall satisfaction. It’s also a good way of improving the environmental impact of web solutions!

 

Efficient memory management

The Scriban engine is also designed to be economical in terms of memory usage. By using more advanced memory management techniques, such as object pooling and intelligent caching of template results, Scriban ensures that resources are used optimally, which is essential for maintaining system stability and performance under high loads.

 

Scalability and adaptability

Finally, Scriban’s lightweight design plays a crucial role in its ability to scale with the application. Whether for small sites or large-scale deployments, Scriban maintains performance consistency, enabling companies to grow without encountering performance limitations linked to the template engine.

These aspects make Scriban the solution of choice for technical decision-makers looking to optimize web application performance. By integrating Scriban into their SXA projects, companies can not only accelerate the development and implementation of new functionalities, but also guarantee greater responsiveness and end-user satisfaction. These advantages make Scriban a strategic investment for any Sitecore SXA project.

 

Example of how to use Scriban

Let’s say you have a map component on your website and you want to create different renderings of map variants. Here’s how you can do it with Scriban:

1. Create a new variant for your map component in Sitecore SXA.
2. In the “Variants” tab, select “Scriban” as the template engine.
3. In the Scriban model editor, you can write your Scriban code to define the rendering of the variant. Here’s an example:

 

 

In this example:

• Fields are dynamically replaced by contributed values (Title, Description, Image, Url, etc.).
• We check whether the parameter showImage is defined in the component parameters. If it is, we display the map image with title, description and a “Learn more” button.
• If the showImage parameter is not set or is false, we simply display the title, description and “Learn more” button without the image.

 

So, depending on the settings you define for each component instance, you can dynamically control the rendering of your map component using Scriban in Sitecore SXA.

 

List of the main objects and functions available in Scriban

The list of main objects and functions available in Scriban, especially for Sitecore SXA, is quite extensive and allows a wide variety of uses in templates. Here are the most notable items:

 

Built-in objects

• i_item – Represents the current Sitecore element.
• i_context_item – Points to the Sitecore context element, often used for page information.
• i_datasource – Provides access to the data source element configured for a component.
• i_site – Contains information about the current Sitecore site.

 

Common functions

• field – Retrieves the value of a field from the Sitecore element.
• query and fast_query – Perform queries to extract data from the Sitecore database.
• link – Generates a URL link from a Sitecore element.

 

Text manipulation functions

• capitalize – Capitalize the first letter of each word in a string.
• format – Format strings, dates or numbers according to a specified pattern.
• html_encode and url_encode – Encode strings for use in HTML or URLs, respectively.

 

Collection management functions

• add – Adds an element to an array.
• remove – Removes an element from an array.
• where – Filters a collection based on a specified condition.

 

Date and Time functions

• now – Returns the current date and time.
• add_days – Adds a specified number of days to a date.

 

Condition and loop functions

• if, else – Control structures for testing conditions.
• for – Loops over a collection or range of numbers.

 

SXA-specific functions

• render_variant – Used to render an SXA rendering variant.
• edit_frame – Used to integrate SXA editing features into rendering.

 

These objects and functions enable developers to build highly dynamic and interactive templates using Scriban in the Sitecore SXA environment. They offer considerable flexibility for content customization and display, adhering to the best practices of modern Sitecore development.

 

To find out more, click here for an exhaustive list of available objects and functions:

• The embedded items and objects in the scriban context 
• The embedded functions for the scriban template

 

Need more information or specific support? Contact us, the Sitecore experts at Castelis are at your disposal.