Benchmark: Handlebars vs Hogan vs Mustache

HTML Preparation code:

<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.7.6/handlebars.min.js" integrity="sha512-zT3zHcFYbQwjHdKjCu6OMmETx8fJA9S7E6W7kBeFxultf75OPTYUJigEKX58qgyQMi1m1EgenfjMXlRZG8BXaw==" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/4.0.1/mustache.min.js" integrity="sha512-6AXIWogbKpsHvoZJrJtHpIYES4wP8czSj0zk7ZfwOYS8GWYFNSykwdfapt7yQc4ikZytemBu+QyVObzBHJMwYg==" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/hogan.js/3.0.2/hogan.min.js" integrity="sha512-F6j8lc1UBrmZHqUGreg4gNVVMCehTbf/LU0s/nnsQJYVeFSdpci+fcL48gsTd1Fbf08sD/kL+is2QiEssvJ70g==" crossorigin="anonymous"></script>

Script Preparation code:

var template = "<strong>This is a slightly more complicated {{thing}}.</strong>.\n{{! Just ignore this business. }}\nCheck this out:\n{{#hasThings}}\n<ul>\n{{#things}}\n<li class={{className}}>{{word}}</li>\n{{/things}}</ul>.\n{{/hasThings}}\n{{^hasThings}}\n\n<small>Nothing to check out...</small>\n{{/hasThings}}";

var handlebarsRenderer = Handlebars.compile(template);
var hoganRenderer = Hogan.compile(template);
var mustacheRender = Mustache.parse(template);

Tests:

Handlebars
Handlebars.compile(template)
Hogan
Hogan.compile(template)
Mustache
Mustache.parse(template)

Historical Performance Data aggregated from 19 community runs

Desktop Results:

Chrome 14 runs

Handlebars

9.9M/s

Mustache

1.6M/s

Hogan

1.5M/s

Fastest: Handlebars (6.8x faster)

View exact numbers

✓ Handlebars: 9,923,235 ops/sec
• Mustache: 1,610,309 ops/sec
• Hogan: 1,455,945 ops/sec

Firefox 5 runs

Handlebars

4.1M/s

Mustache

2.0M/s

Hogan

1.8M/s

Fastest: Handlebars (2.3x faster)

View exact numbers

✓ Handlebars: 4,064,594 ops/sec
• Mustache: 1,996,946 ops/sec
• Hogan: 1,805,654 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Handlebars
Hogan
Mustache

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36

Browser/OS: Chrome 137 on Mac OS X 10.15.7

View result in a separate tab

Handlebars

105.5M/s

Mustache

10.8M/s

Hogan

8.4M/s

View exact numbers

Test name	Executions per second
✓ Handlebars	105,525,096 Ops/sec
Mustache	10,756,962 Ops/sec
Hogan	8,352,242 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net.

**Benchmark Overview**

The benchmark compares the performance of three template rendering libraries: Handlebars, Hogan, and Mustache. The test case uses the same template string, which is defined in the `Script Preparation Code` section of the benchmark definition JSON. The task is to compile this template string into a renderable format using each library.

**Template Rendering Libraries**

1. **Handlebars**: A popular JavaScript templating engine that allows developers to create dynamic web pages by separating presentation from application logic. Handlebars uses a syntax similar to HTML, but with additional features like expressions and conditionals.
2. **Hogan**: Another template rendering library that aims to provide high performance and flexibility. Hogan is designed to be faster than traditional templating engines like Handlebars.
3. **Mustache**: A lightweight JavaScript templating engine that uses a syntax called "handlebars" (similar to Handlebars). Mustache is known for its simplicity and ease of use.

**Comparison Options**

The benchmark compares the performance of each library by executing their respective `compile` or `parse` methods on the same template string. The execution time is measured in executions per second, which represents how many times the template is rendered within a given timeframe.

**Pros and Cons**

Here's a brief summary of the pros and cons for each library:

* **Handlebars**:
	+ Pros: Wide adoption, extensive community support, and a comprehensive feature set.
	+ Cons: Can be slower than Hogan due to its more complex rendering process.
* **Hogan**:
	+ Pros: High performance, optimized for speed, and easy to use.
	+ Cons: Smaller community compared to Handlebars, which might limit its flexibility.
* **Mustache**:
	+ Pros: Lightweight, simple, and fast.
	+ Cons: Limited feature set compared to Handlebars and Hogan.

**Other Considerations**

When choosing a template rendering library, consider the following factors:

* **Complexity**: If you need to render complex templates with many conditionals or expressions, Handlebars might be a better choice. For simpler templates, Mustache could be sufficient.
* **Performance**: If speed is crucial for your application, Hogan might be the best option due to its optimized rendering process.
* **Community Support**: If you prefer a well-established community and a wide range of resources, Handlebars is likely the way to go.

**Latest Benchmark Results**

The latest benchmark results show that:

* Handlebars performs the fastest with an average execution time of 3680275.25 executions per second.
* Hogan comes in second with an average execution time of 1555071.125 executions per second.
* Mustache is the slowest with an average execution time of 1787664.625 executions per second.

Keep in mind that these results are specific to this particular template and may vary for other use cases.

**Other Alternatives**

If you're interested in exploring alternative template rendering libraries, consider:

* **Underscore.js**: A popular JavaScript library that provides utility functions, including templating helpers.
* **Pug.js**: A fast and flexible templating engine that compiles to plain JavaScript.
* **EJS (Embedded JavaScript)**: A traditional server-side templating engine that's widely used in Node.js applications.

Handlebars vs Hogan vs Mustache (version: 0) Benchmark.js

Comparing performance of: `Handlebars vs Hogan vs Mustache`

Created: 5 years ago by: Registered User

Go to the latest result

Handlebars

Hogan

Mustache

Historical Performance Data aggregated from 19 community runs

Desktop Results:

Chrome 14 runs

Firefox 5 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

Handlebars vs Hogan vs Mustache (version: 0) Benchmark.js

Comparing performance of: Handlebars vs Hogan vs Mustache

Created: 5 years ago by: Registered User

Go to the latest result

Handlebars

Hogan

Mustache

Historical Performance Data aggregated from 19 community runs

Desktop Results:

Chrome 14 runs

Firefox 5 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

Related benchmarks

Comparing performance of: `Handlebars vs Hogan vs Mustache`