Top 5 View Template Engines for Spring

A template engine is a software component that allows developers to define templates, which are typically HTML or XML files with placeholders for dynamic content, thus creating dynamic web pages.

When it comes to developing web applications with Spring, choosing the right view template engine is key to creating dynamic and visually appealing user interfaces. In this article, we’ll explore the top 5 view template engines for Spring framework.

From the simplicity of Mustache to the feature-rich capabilities of Thymeleaf and the well-established JSP, we will explore each engine’s unique features, advantages, and use cases. Along the way, we will also provide step-by-step instructions to help you set up templates with ease.

1. Thymeleaf

Thymeleaf is a powerful and feature-rich view template engine that focuses on HTML5 compliance and seamless integration with Spring’s ecosystem. It offers a natural templating approach by using standard HTML attributes for dynamic content rendering.

Thymeleaf’s intuitive syntax and extensive set of features like dynamic data binding, powerful expression language, and seamless integration with Spring make it a top choice. With Thymeleaf, we can effortlessly bind data to HTML templates, leverage conditional statements and loops for dynamic content rendering, and benefit from the extensive support for internationalization and customization.

1.1. Setup

To add Thymeleaf, we can add spring-boot-starter-thymeleaf dependency in the application:

<dependency>
   <groupId>org.springframework.boot</groupId>
   <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

By default, Thymeleaf expects your templates to be located in the ‘src/main/resources/templates‘ directory. However, we can customize the template prefix and suffix as per the project structure in application.properties. Inside the template directory, we create the template files with the desired name, for example, `thymeleaf.html`.

# default is classpath:/templates/
spring.thymeleaf.prefix=classpath:/templates/

# default is .html
spring.thymeleaf.suffix=.html

In the template file, add the Thymeleaf namespace declaration to enable its syntax and then use standard HTML markup to design your template.

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Thymeleaf Demo</title>
</head>
<body>
<h1 th:text="${message}"></h1>
Current date and time: <p th:text="${#dates.format(#dates.createNow(), 'yyyy-MM-dd HH:mm:ss')}"></p>
</body>
</html>

Inside the MVC controller, define a handler method to handle requests and return the template name (without file extension) as the response.

@Controller
public class HomeController {

	@GetMapping("/thyme")
	public String home(Model model) {

		model.addAttribute("message", "Welcome to the Demo using Thymeleaf!");
		return "thymeleaf";
	}
}

Build and run your Spring Boot application and visit the URL in the browser, such as http://localhost:8080/thyme. Thymeleaf will process the template, apply the dynamic data, and render the resulting HTML page.

1.2. Advantages

Seamless integration with Spring Framework: Thymeleaf is designed to work smoothly with Spring Boot and provides easy integration with Spring features such as form handling, internationalization, and validation.
Full HTML5 compliance: Thymeleaf fully supports HTML5 syntax and tags, making it suitable for modern web development.
Powerful templating features: Thymeleaf offers a rich set of features, including conditional expressions, iteration, variable manipulation, and template layout management.

1.3. Disadvantages

Steep Learning Curve: While Thymeleaf is generally considered easy to learn and use, it still requires developers to understand its syntax and features. If you are new to Thymeleaf or have experience with other template engines, there may be a learning curve involved in getting familiar with Thymeleaf’s specific conventions and best practices.
Template Complexity: Thymeleaf offers powerful templating features, but complex templates with extensive logic can become difficult to manage and maintain over time. It’s important to strike a balance between leveraging Thymeleaf’s features and keeping templates clean and maintainable.
Performance Considerations: Although Thymeleaf generally performs well, it may not be the most performant template engine in all scenarios. In some cases, particularly with large or complex templates, the processing and rendering time of Thymeleaf may be slightly slower compared to more lightweight template engines, for example, Mustache, Velocity and so on.

2. Mustache

Mustache is a simple and lightweight template engine that helps in creating dynamic web pages. It originated from the idea of separating the logic and presentation layers in web development.

It provides a way to render templates by replacing placeholders, also known as “mustaches,” – {{ }} with actual values. Mustache templates are human-readable and allow for easy collaboration between designers and developers.

Mustache follows a “logic-less” approach, meaning it focuses on providing a clean and minimalistic template syntax without incorporating complex programming constructs. This makes it easy for developers to understand and work with.

2.1. Setup

To add Mustache as a dependency in your Maven project, you can include the following code in your pom.xml file:

<dependency>
   <groupId>org.springframework.boot</groupId>
   <artifactId>spring-boot-starter-mustache</artifactId>
</dependency>

After adding the dependency, Maven will download the required Mustache library and make it available for your project.

By default, Mustache expects your templates to be located in the src/main/resources/templates directory.

spring.mustache.prefix=classpath:/templates/
spring.mustache.suffix=.html

Inside the src/main/resources/templates directory, create an HTML file with the desired name, for example, `mustache.html`. Add the Mustache syntax to the HTML file to define the dynamic content.

Mustache uses double curly braces `{{ }}` to enclose the variables or expressions.

<!DOCTYPE html>
<html>
<head>
   <title>Mustache Demo</title>
</head>
<body>
   <h1>{{message}}</h1>
</body>
</html>

In this example, the `message` variable will be replaced with the actual value when the template is rendered.

@Controller
public class HomeController {
	@GetMapping("/mustache")
	public String homeMustache(Model model) {

		model.addAttribute("message", "Welcome to the Mustache Demo!");
		return "home";
	}
}

In this example, the homeMustache method handles the “/mustache” URL and adds the message attribute to the Model object. It then returns the name of the template file, “home”, without the file extension.

Build and run your Spring Boot application. Visit the specified URL in your browser, such as http://localhost:8080/mustache.

2.2. Advantages

Simplicity: Mustache has a simple and intuitive syntax, making it easy to learn and use. Its minimalistic approach allows for quick template creation and understanding.
Language Agnostic: Mustache is a language-agnostic template engine, which means it can be used with various programming languages, including Java, JavaScript, Ruby, Python, and more. This flexibility enables cross-platform and multi-language development.

2.3. Disadvantages

Limited Logic Handling: Mustache has a limited set of built-in logic constructs compared to other template engines. It lacks advanced features such as loops, complex conditionals, or custom functions. This simplicity can be a disadvantage for projects that require extensive logic manipulation within templates.
Customization Limitations: Mustache follows a design philosophy of simplicity and convention over configuration. As a result, it might have limited customization options compared to other template engines that provide more configuration flexibility.

3. Freemarker

Apache FreeMarker is a Java library to generate text output (HTML web pages, e-mails, configuration files, source code, etc.) based on templates and changing data. Templates are written in the FreeMarker Template Language (FTL), which is a simple, specialized language (not a full-blown programming language like PHP).

Unlike Mustache, FreeMarker offers extensive logic handling capabilities, including conditionals, loops, variables, macros, and custom directives. It supports template inheritance and includes powerful expression language features.

3.1. Setup

In your Maven `pom.xml` file, include the following dependency to add Freemarker support to the project:

<dependency>
   <groupId>org.springframework.boot</groupId>
   <artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>

This will download the required Freemarker library and make it available for your project. Inside the `src/main/resources/templates` directory, create an FTL (Freemarker Template Language) file with the desired name, for example, `freemarker.ftlh`.

<!DOCTYPE html>
<html>
<head>
    <title>Freemarker Demo</title>
</head>
<body>
    <h1>${message}</h1>
    <p>Current date and time: ${.now}</p>
</body>
</html>

In this example, the `${message}` placeholder will be replaced with the actual value when the template is rendered.

@Controller
public class HomeController {

	@GetMapping("/freemarker")
	public String homeFreemarker(Model model) {

		model.addAttribute("message", "Welcome to the Demo using Freemarker!");
		return "freemarker";
	}
}

In this example, the `homeFreemarker` method handles the “/freemarker" URL and adds the `message` attribute to the `Model` object. It then returns the name of the template file, “freemarker“, without the file extension. Build and run your Spring Boot application. Visit the specified URL in your browser, such as http://localhost:8080/freemarker.

3.2. Advantages

Powerful Logic Handling: Similar to Thymleaf, FreeMarker provides extensive logic handling capabilities, including conditionals, loops, variables, macros, and custom directives. This allows for dynamic content generation and complex data manipulation within templates.
Flexible and Expressive Syntax: FreeMarker’s syntax is easy to understand and resembles HTML/XML, making it familiar to web developers. It offers a wide range of built-in features and expression language constructs, enabling flexible template design and data processing.
Seamless Integration with Java: FreeMarker seamlessly integrates with Java applications, making it a popular choice for Java developers. It provides robust support for accessing Java objects, invoking methods, and interacting with Java APIs directly within templates.

3.3. Disadvantages

Learning Curve: FreeMarker, unlike Mustache, is not so simple to write and hence has a learning curve to some extent, especially for developers who are new to template engines or unfamiliar with its syntax and features. It may take some time to understand the template structure, expression language, and the best practices for effective template design.
Template Size: FreeMarker templates can become verbose, especially when dealing with complex logic or large amounts of dynamic content. This can lead to larger template files, which may be harder to maintain and increase the risk of errors or inconsistencies.
Limited Customization: While FreeMarker offers a range of features and customization options, there may be scenarios where developers require more extensive customization or advanced functionality that is not directly supported by the template engine. In such cases, additional workarounds or extensions may be required.

4. Groovy

Groovy is a dynamic and expressive view template engine that seamlessly integrates with Spring. It leverages the power of the Groovy language to provide a flexible and concise way of creating view templates. It is a great choice for developers who are familiar with the Groovy language or prefer a more programmatic approach to view templates.

With Groovy, developers can combine the simplicity of a templating language with the expressive features of a full programming language. It offers a rich set of features, including template inheritance, loops, conditionals, and custom tags, allowing programmers to create dynamic and interactive views.

4.1. Setup

In your Maven `pom.xml` file, include the following dependency to add Groovy support to the project:

<dependency>
  <groupId>org.springframework.boot</groupId>
  <artifactId>spring-boot-starter-groovy-templates</artifactId>
</dependency>

Inside the appropriate directory – src/main/resources/templates, create a Groovy Template file (with the file extension “.tpl”) and define the desired layout and dynamic content using the Groovy Template syntax. This definitely looks more like a regular code than an expressive template as we have seen for other template engines.

yieldUnescaped '<!DOCTYPE html>'
html(lang:'en') {
    head {
        meta('http-equiv':'"Content-Type" content="text/html; charset=utf-8"')
        title("Groovy Demo")
    }
    body {
        h3 ("$message")

        p ("Current date and time: ${new Date()}")
    }
}

Annotate a class as a controller and define a method to handle requests. Within the method, prepare the data and pass it to the template engine for rendering. Return the name of the template file.

@GetMapping("/groovy")
public String template(Model model) {

  model.addAttribute("message", "Welcome to the Demo using Groovy");
  return "index";
}

Build and run your application. Access the specified URL – http://localhost:8080/groovy in your browser to see the rendered output generated by the Groovy Template engine.

4.2. Advantages

Integration with Groovy Language: Groovy templates leverage the power and expressiveness of the Groovy language. This means developers can utilize features such as dynamic typing, closures, and metaprogramming to write more concise and flexible templates. Groovy’s rich language features enable complex logic and dynamic content generation within templates.
Dynamic Content Generation: Groovy templates provide dynamic content generation capabilities. Developers can embed Groovy code within the templates to generate dynamic content based on the data and logic. This makes it easier to create personalized and adaptive user interfaces.
Seamless Integration with Java: Groovy is built on the Java platform and offers seamless integration with Java libraries and frameworks. Groovy templates can access and utilize existing Java classes, libraries, and frameworks, allowing developers to leverage the vast ecosystem of Java tools and technologies.
IDE Support: Groovy templates are well-supported by popular Integrated Development Environments (IDEs) such as IntelliJ IDEA, Eclipse, and Visual Studio Code. IDEs provide features like syntax highlighting, code completion, and refactoring support, which enhance productivity and ease of development.
Performance: Groovy templates can be compiled to bytecode, resulting in improved performance compared to interpreted templates. The compiled templates can be cached, reducing the processing overhead and improving the response time of web applications.

4.3. Disadvantages

Learning Curve: Groovy has its own syntax and features that may require developers to invest time in learning and becoming proficient in the language. While it shares similarities with Java, there are differences that need to be understood and mastered.
Documentation and Resources: While Groovy has a supportive community, its documentation and available resources might not be as extensive as those for more widely used languages. Finding specific solutions or troubleshooting issues may require more effort or rely on community forums and discussions.
Development and Maintenance: Since Groovy is a dynamic language, it may require more rigorous testing and maintenance to catch potential runtime errors or bugs that could be caught at compile-time in statically typed languages. This can increase the development and maintenance effort in the long run.

5. JSP (Java Server Pages)

JSP (JavaServer Pages) is a time-tested and widely used view template engine for Spring. JSP was introduced by Sun Microsystems (now Oracle) in the late 1990s as a part of the Java Enterprise Edition (Java EE) platform. JSP offers a familiar approach to web development by allowing developers to embed Java code directly into HTML pages. With JSP, programmers can seamlessly integrate dynamic content into their applications using a mix of HTML and Java.

5.1. Setup

For Maven, add the following dependency to the pom.xml file:

<dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-tomcat</artifactId>
            <version>3.1.0</version>
            <scope>provided</scope>
 </dependency>
 <dependency>
            <groupId>org.apache.tomcat.embed</groupId>
            <artifactId>tomcat-embed-jasper</artifactId>
            <scope>provided</scope>
</dependency>

Spring Boot uses an embedded Tomcat server by default. The tomcat-embed-jasper dependency provides the necessary classes to support JSP execution within the embedded Tomcat server. It includes the required servlet container and JSP container implementation for Tomcat.

As per legacy convention, we place our JSP files in the src/main/webapp/WEB-INF/views/ directory. We need to let Spring know where to locate these JSP files by configuring two properties in the application.properties file:

spring.mvc.view.prefix=/WEB-INF/views/
spring.mvc.view.suffix=.jsp

As defined in the above properties, inside the src/main/webapp/WEB-INF/views directory, create your JSP views. Inside the /WEB-INF/views directory, create the test.jsp file – as below:

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html>
<head>
    <title>Sample JSP</title>
</head>
<body>
    <h1>${message}</h1>
    <p>Current date and time: <%= new java.util.Date() %></p>
</body>
</html>

The <%= ... %> syntax is used to include Java code directly within the JSP.

@GetMapping("/jsp")
public String templateJSP(Model model) {

  model.addAttribute("message", "Welcome to the Demo using JSP");
  return "test";
}

Build and run your Spring Boot application. Visit the specified URL in your browser, such as http://localhost:8080/jsp.

5.2. Advantages

Mature Ecosystem: JSP has been around for a long time and has a mature ecosystem with a vast collection of libraries, frameworks, and tools. This provides developers with a wide range of resources and community support, making it easier to find solutions, troubleshoot issues, and enhance the functionality of JSP-based applications.
Java Integration: JSP allows seamless integration with Java code, making it easy to access Java objects, invoke methods, and interact with Java APIs directly within the JSP pages. This enables the development of dynamic and robust web applications using the power of the Java language.
Familiar Syntax: JSP uses a syntax similar to HTML, which is widely known and understood by web developers. This makes it easier for developers to create and maintain JSP pages, especially if they are already familiar with HTML and web development concepts.

5.3. Disadvantages

Performance Overhead: JSP requires compilation and generation of servlets during runtime, which can introduce some performance overhead compared to static HTML files. However, modern application servers and caching mechanisms can help mitigate this issue to a certain extent.
Limited Cross-Platform Compatibility: JSP is primarily designed for Java-based web applications and may not be as compatible with other platforms or languages. This can limit the ability to reuse or share JSP components in non-Java environments.

6. Comparison between All Template Engines

After providing detailed explanations of all five template engines, let’s now take a quick look at their feature comparisons. This will help you make an informed decision based on your specific requirements.

Template Engine	Syntax	Logic Handling	Integration with Java	IDE Support	Performance	Ease of Learning
Mustache	Simple and minimalistic syntax. Uses {{ }} for variables and {{# }} and {{^ }} for conditionals.	Limited logic handling capabilities. Focuses on data rendering without supporting complex logic.	Supports seamless integration with Java.	Good IDE support with plugins available for popular IDEs.	High performance due to its lightweight nature.	Easy to learn with a minimalistic syntax and fewer features to master.
Thymeleaf	HTML-like syntax with Thymeleaf-specific attributes and expressions. Uses th: prefix for attributes.	Provides powerful logic handling capabilities including conditionals, loops, and template composition.	Offers seamless integration with Java, providing support for Spring Framework.	Good IDE support with dedicated plugins available.	Performance is generally good, but complex expressions or heavy use of dynamic content can impact performance.	Requires some learning to understand Thymeleaf-specific syntax and features.
Groovy	Uses a syntax similar to traditional HTML/XML with the ability to embed Groovy code.	Provides extensive logic handling capabilities with the full power of the Groovy language available for complex operations.	Offers seamless integration with Java, leveraging the Groovy language’s interoperability with Java.	Good IDE support available with plugins for popular IDEs.	Performance can be impacted by the dynamic nature of Groovy, but it offers flexibility in content generation.	Requires learning Groovy syntax and features, which might have a moderate learning curve for developers unfamiliar with Groovy.
Freemarker	Template syntax is similar to HTML/XML with placeholders enclosed in ${ } or #{ }.	Offers robust logic handling capabilities including conditionals, loops, variables, macros, and custom directives.	Supports seamless integration with Java.	Good IDE support is available with plugins for popular IDEs.	Performance is generally good, with efficient template processing.	Requires learning the syntax and features of FreeMarker, but the learning curve is manageable.
JSP	HTML-like syntax with Java code embedded within scriptlet tags <% %>.	Good IDE support is available with dedicated features for JSP development.	Provides seamless integration with Java Servlets and other Java EE technologies.	Good IDE support is available with plugins for popular IDEs.	Performance is generally good, but excessive use of Java code within templates can impact performance.	JSP has been widely used and has good community support, making it relatively easy to find resources and examples.

Tabular comparison of all 5 template engines

Source Code on Github

Top 5 View Template Engines for Spring

1. Thymeleaf

1.1. Setup

1.2. Advantages

1.3. Disadvantages

2. Mustache

2.1. Setup

2.2. Advantages

2.3. Disadvantages

3. Freemarker

3.1. Setup

3.2. Advantages

3.3. Disadvantages

4. Groovy

4.1. Setup

4.2. Advantages

4.3. Disadvantages

5. JSP (Java Server Pages)

5.1. Setup

5.2. Advantages

5.3. Disadvantages

6. Comparison between All Template Engines

Comments

About Us

Tutorial Series

Meta Links

Our Blogs

Dark Mode

1. Thymeleaf

1.1. Setup

1.2. Advantages

1.3. Disadvantages

2. Mustache

2.1. Setup

2.2. Advantages

2.3. Disadvantages

3. Freemarker

3.1. Setup

3.2. Advantages

3.3. Disadvantages

4. Groovy

4.1. Setup

4.2. Advantages

4.3. Disadvantages

5. JSP (Java Server Pages)

5.1. Setup

5.2. Advantages

5.3. Disadvantages

6. Comparison between All Template Engines

Further reading:

Comments

About Us

Tutorial Series

Meta Links

Our Blogs

Dark Mode