Twig in Drupal: How does Twig boost Drupal performance?

Twig replaced PHP as the template engine in Drupal 8. There are clear advantages to making use of Twig in Drupal and boost the Drupal performance..

There is a clear advice that the business logic and theme layer be separated, which implies that the template should only show the content and not select how it will be displayed.

In the Drupal, the debate between Twig and PHP template engines has been a hot topic. However, as technology evolves, Twig emerges as the undisputed champion, offering many advantages over traditional PHP templates.

Why twig is being used?

Twig is a template engine and gives following advantages:

1. Fast: Twig compiles template into simple PHP code and puts the compiled code into the filesystem. 
2. Secure: In the twig template you can't write code that can directly interact with database hence it is much secure
3. Flexible: Twig is versatile enough to allow you to create your own custom filters and functions to add extra flavour to it. 

Let's understand why Twig in Drupal is a game-changer.

Understanding Twig in Drupal

Twig, a versatile and secure templating engine, was introduced in Drupal 8 to replace the old PHP template system. Leveraging the power of Symfony, Twig brings modern templating features to Drupal, making it more intuitive for developers and themers alike.

Twig is a constructed templating language built on PHP. The Twig engine uses the template that your web page produces to create a "compiled" PHP template that is kept in a secure directory under sites/default/files/php/twig. The compilation process is one-time only; template files are cached for future usage and recompiled only if  cache has been cleared. That saves a lot of time during page request to serve a processed content.

Enhanced Readability and Maintainability

Twig syntax are more clear and easy to write as compare to PHP specially for Front End developers because they might not be familiar with PHP code. 

There is no major change in file naming, they looks same.

PHP Template

my-php-template.tpl.php

Twig Template

my-twig-template.html.twig

Variables are more readable

# PHP
<div><?php echo $data['name']; ?></div>

# Twig
<div>{{ data.name }}</div>

# PHP
<?php echo $node->id() ?>

# Twig
{{ node.id }}

# PHP
<?php echo check_plain($my_var); ?>

# Twig
{{ my_var }}

For complete list kindly explore the twig documentation.

Robust Security Features

In the web development, security is crucial, and Twig succeeds in this area. Twig in Drupal assists in preventing common vulnerabilities like as cross-site scripting (XSS) attacks by default to automatically escaping output and reducing the possibility of code injection.

For example below PHP code can execute the script stored in the variable

$var = '<script>alert("I am an alert")</script>';
echo $var;

Image

# If we pass the variable to twig function and print in the template, script will be printed as text.

/**
 * Builds the response.
 */
public function __invoke(): array {

  $var = '<script>alert("I am an alert")</script>';
  return [
    '#theme' => 'bhimmu',
    '#data' => $var,
  ];
}

In the twig template

{{ data }}

Output

Image

Clear separation of business logic and presentation layer

The PHP language itself was the main flaw in the PHP template. The logic to show the content should be written in the template; do not write the logic to compute, preprocess the data, or use functions to bog down the system. There won't be any additional processing after the prepared data is transferred to the theme layer.

Twig does this precise separation; other than loops, conditions, filters, and so on, there are no further processing options available in a Twig file.

Debugging is easy with Twig in Drupal

We can easily debug the variables and attributes available inside a twig template. Here is the detailed video on twig debugging provided by Drupal.

Attach libraries directly to the twig templated

One excellent method for loading CSS and JS into the page as needed is to use libraries. Twig in Drupal makes it feasible to use CSS and JS on certain pages even if you don't need them for the rest of the site. 

  {{ attach_library('fluffiness/cuddly-slider') }}

Conclusion

Twig is simple, template-oriented, full-featured, easy to learn, extendable, documented, and both secure and fast. So having Twin in Drupal is fantastic. Use it appropriately to improve the performance of your Drupal application.