# Whats the best view engine for node.js (ejs , jade or handlebars)?

**URL:** <https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192>\
**Category:** General\
**Created:** [January 13, 2017, 1:54pm UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192 "2017-01-13T13:54:54Z")\
**Posts on this page:** 19\
**Page:** 2

<div class="post-metadata">

**Author:** ![mohammadavood](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/mohammadavood/32/75306_2.png) [@mohammadavood](https://forum.freecodecamp.org/u/mohammadavood)\
**Post date:** [January 8, 2018, 9:51pm UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/21 "2018-01-08T21:51:40Z")

</div>

pug is Very awful 🤢🤢🤮🤮🤮  
specially in large projects , it will become to a big trouble …  
even it don’t undrestand svg and when put a svg or xml into your pug file not only it will’nt show your svg but it destroy rest of the page code

---

<div class="post-metadata">

**Author:** ![JohnnyBizzel](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/johnnybizzel/32/37661_2.png) [@JohnnyBizzel](https://forum.freecodecamp.org/u/JohnnyBizzel)\
**Post date:** [January 8, 2018, 10:40pm UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/22 "2018-01-08T22:40:39Z")

</div>

I think the answer is there is no **best**.  
You have a few options which are worth knowing about and from then you can decide depending on the use case.  
Each one is not that hard to learn, so worth investigating each one.

---

<div class="post-metadata">

**Author:** ![rahuls360](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/rahuls360/32/75644_2.png) [@rahuls360](https://forum.freecodecamp.org/u/rahuls360)\
**Post date:** [June 19, 2018, 8:18am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/23 "2018-06-19T08:18:50Z")

</div>

Thank you all for sharing your thoughts. From reading the above comments to doing a little research I realized it all comes down to **choosing the best option as per your context**.

[slant.co](http://slant.co) had some useful comparisions of these templating engines on its website. I have learnt little ejs and believe that its good for me at work, as our websites are mostly static and It allows me to use the same old HTML format. Non-developers sometimes need to read my code, so ejs retains the old HTML syntax.

Whereas pug is more cleaner and easier to read, but that would require me to rewrite the code, which won’t work for me at work as we quite often use premade templates. (aka HTML code written by others).

I will use ejs for work /working with non-developers, and use pug while working alone.

---

<div class="post-metadata">

**Author:** ![arw2015](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/arw2015/32/15368_2.png) [@arw2015](https://forum.freecodecamp.org/u/arw2015)\
**Post date:** [July 7, 2018, 12:59pm UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/24 "2018-07-07T12:59:13Z")

</div>

They all work in a similar way, but the handlebars style syntax: {{ title }} is becoming the standard. As well as handlebars, it is also used for interpolation by Angular and Vue.js. It’s easier to read (and type) than EJS, I think.

---

<div class="post-metadata">

**Author:** ![DevelAx](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/develax/32/159292_2.png) [@DevelAx](https://forum.freecodecamp.org/u/DevelAx)\
**Post date:** [December 3, 2018, 2:34pm UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/25 "2018-12-03T14:34:08Z")

</div>

For me, Razor is more concise and syntactically close to native HTML and JS.

```auto
// Pug example:

unless user.isAnonymous
  p You're logged in as #{user.name}

ul
  each val in numbers
    li= val

```

vs

```auto
// EJS example:

<% if (!user.isAnonymous) { %>
  <p>You're logged in as <%= user.name %></p>
<% } %>

<ul>
  <% numbers.forEach(function(val){ %>
    <li><%= val %></li>
  <% }); %>
</ul>

```

vs

```auto
// Razor example:

@if (!user.isAnonymous) { 
  <p>You're logged in as @user.name</p>
}

<ul>
@for(var i = 0; i < numbers.length; i++){
    <li>@numbers[i]</li>
}
</ul>

```

---

<div class="post-metadata">

**Author:** ![harry34](https://avatars.discourse-cdn.com/v4/letter/h/a698b9/32.png) [@harry34](https://forum.freecodecamp.org/u/harry34)\
**Post date:** [December 15, 2018, 4:30pm UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/26 "2018-12-15T16:30:39Z")

</div>

How about [Nunjucks by Mozila](https://mozilla.github.io/nunjucks/)?

---

<div class="post-metadata">

**Author:** ![DevelAx](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/develax/32/159292_2.png) [@DevelAx](https://forum.freecodecamp.org/u/DevelAx)\
**Post date:** [December 25, 2018, 8:12am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/28 "2018-12-25T08:12:58Z")

</div>

The syntax looks similar to [EJS](https://www.ejs.co/).

---

<div class="post-metadata">

**Author:** ![Ronnehag](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ronnehag/32/106719_2.png) [@Ronnehag](https://forum.freecodecamp.org/u/Ronnehag)\
**Post date:** [December 25, 2018, 9:14am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/29 "2018-12-25T09:14:21Z")

</div>

Coming from HTML and learning templates I would say EJS is easier to grasp, it’s very close to plain HTML and uses same elements.  
After working a lot with [ASP.NET](http://ASP.NET) and Razor I had an easier time with EJS.

---

<div class="post-metadata">

**Author:** ![DevelAx](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/develax/32/159292_2.png) [@DevelAx](https://forum.freecodecamp.org/u/DevelAx)\
**Post date:** [December 26, 2018, 9:12am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/30 "2018-12-26T09:12:36Z")

</div>

Classic ASP syntax was pretty similar to EJS:

```auto
<ul>
<%for i = 0 to 10%>
<li><%=i%></li>
<%next%>
</ul>

```

Then they developed Razor, the purpose of that was to simplify and improve the syntax. I couldn’t agree that the example above is easier to read and write than the same written in Razor syntax - for me, it’s not faster, not shorter, not clearer to write `<%...%>` characters at the beginning and end of each code line or expression. But as it’s known _“beauty is in the eye of the beholder”_.

---

<div class="post-metadata">

**Author:** ![JenniferT](https://avatars.discourse-cdn.com/v4/letter/j/9e8a1a/32.png) [@JenniferT](https://forum.freecodecamp.org/u/JenniferT)\
**Post date:** [December 27, 2018, 5:17am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/31 "2018-12-27T05:17:08Z")

</div>

Depends upon what client-side MVC framework you want use, Angular or Backbone or Ember and also are you a HTML lover. In my opinion, the best view engines are the ones that help developers avoid security flaws, like cross-site scripting (XSS).

---

<div class="post-metadata">

**Author:** ![vuchan](https://avatars.discourse-cdn.com/v4/letter/v/41988e/32.png) [@vuchan](https://forum.freecodecamp.org/u/vuchan)\
**Post date:** [January 22, 2019, 2:19am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/32 "2019-01-22T02:19:57Z")

</div>

`.ejs` is the best template engine after i read those comments on my way.

---

<div class="post-metadata">

**Author:** ![willjw3](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/willjw3/32/196790_2.png) [@willjw3](https://forum.freecodecamp.org/u/willjw3)\
**Post date:** [January 31, 2019, 1:37am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/33 "2019-01-31T01:37:35Z")

</div>

Prefer Handlebars myself.

---

<div class="post-metadata">

**Author:** ![lubodrinka](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/lubodrinka/32/158618_2.png) [@lubodrinka](https://forum.freecodecamp.org/u/lubodrinka)\
**Post date:** [April 18, 2019, 8:10am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/34 "2019-04-18T08:10:12Z")

</div>

[http://handlebarsjs.com/’](http://handlebarsjs) looks like react component

 ![image](https://global.discourse-cdn.com/freecodecamp/original/3X/5/0/509a4d012b56770376ed1379fdad1c635df4a2a6.png)

---

<div class="post-metadata">

**Author:** ![willjw3](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/willjw3/32/196790_2.png) [@willjw3](https://forum.freecodecamp.org/u/willjw3)\
**Post date:** [April 18, 2019, 1:57pm UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/35 "2019-04-18T13:57:29Z")

</div>

Yeah, looks similar in some ways.

---

<div class="post-metadata">

**Author:** ![amroto](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/amroto/32/68437_2.png) [@amroto](https://forum.freecodecamp.org/u/amroto)\
**Post date:** [July 1, 2019, 10:43am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/36 "2019-07-01T10:43:35Z")

</div>

I would like to further expand your endeavor by showing you all the available template engines, here is a blog post that can give you a brief on each one: [https://shieldfy.io/blog/template-engines-nodejs-developers/](https://shieldfy.io/blog/template-engines-nodejs-developers/) . For any further inquiries ask here or on the blog post, and I am glad to help.

---

<div class="post-metadata">

**Author:** ![amine01993](https://avatars.discourse-cdn.com/v4/letter/a/ea666f/32.png) [@amine01993](https://forum.freecodecamp.org/u/amine01993)\
**Post date:** [September 17, 2019, 7:35am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/37 "2019-09-17T07:35:37Z")

</div>

I think [Edge](https://www.npmjs.com/package/edge.js) would be the best option.

---

<div class="post-metadata">

**Author:** ![Nondukishor](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/nondukishor/32/158866_2.png) [@Nondukishor](https://forum.freecodecamp.org/u/Nondukishor)\
**Post date:** [September 30, 2019, 3:46am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/38 "2019-09-30T03:46:45Z")

</div>

I love ejs it’s better and you can write also plain html

---

<div class="post-metadata">

**Author:** ![SujitSingh](https://avatars.discourse-cdn.com/v4/letter/s/58956e/32.png) [@SujitSingh](https://forum.freecodecamp.org/u/SujitSingh)\
**Post date:** [October 17, 2019, 9:03am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/39 "2019-10-17T09:03:15Z")

</div>

I remember myself using Razor templates in .NET. Is there a possible way of using Razor templates outside of .NET project, like in normal HTML file? I tried searching for possible answer but couldn’t get any.

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [January 16, 2021, 11:33am UTC](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192/40 "2021-01-16T11:33:13Z")

</div>



[Previous page](https://forum.freecodecamp.org/t/whats-the-best-view-engine-for-node-js-ejs-jade-or-handlebars/76192.md?page=1)
