15 template engines for front-end development
The number of JS libraries does not decrease at all; on the contrary, it grows every day. When we get to JS applications, templates are the best choice than full libraries, because this leads to cleaner base code and a better process for working with them .
Not so long ago, I wrote that you could try to write your library when the time comes. Template engines require several great skills and an understanding of the language with which you work, so it is better to rely on any template engine from the list below.
Their list can be found on Wikipedia , the engines for different programming languages ​​for the web are perfectly compared there, but they don’t really focus on the same language, so I would like to see how many engines can be listed for Javascript.
If you are developing in Javascript, then you will learn a number of engines, but you can learn about some new ones. I will be happy to continue this list together, and I hope that it will please you.
')
ICanHaz.js
A very simple library for working with templates Mustache, another, faster engine. With it, you can define fragments of templates in script tags with type = "text / html" and call them through id, with validation.
Hogan.js
Twitter is committed to being part of the open-source community. Hogan.js can be used as an intermediate template linker, for compiling them in advance, so that the browser processes these templates dynamically.
It contains the same as Mustache, but it does everything faster and more efficiently.
Handlebars.js
Handlebars is an extension of the Mustache template engine created by Chris Wanstrath. These template engines have languages ​​that are not overloaded with logic, which separate code and presentation, which coincide with our best expectations.
mustache.js
This is the most popular template engine in the world right now, and almost every library in this category somehow flows and ideologically overlaps with it. Documentation is very easy to read, understand, and strongly recommended to use - it runs perfectly in many programming languages, which provides a level of popularity for it above average.
Transparency
Transparency is a client template engine that links data to the DOM. It is written on it simply, clearly, simple native HTML and the same JS. There is no need to learn the syntax of templates, everything is obvious and easy to use.
doT.js
Good for Node.js community . Fast, small, without dependencies. Heroically achieved a balance of speed and flexibility. (In many respects it inherited the quality of the Underscore.js template engine (a component of this library is transl.)) .
Walrus
A lot of presentation logic is involved in modern web applications. This logic does not apply to application code and models, it is a presentation layer. A template language is a good place for it.
This goal is pursued in such a concentrated way that the rate of patterning is not a priority; rather, Walrus is focused on facilitating the development of web application templates.
chibi.js
Chibi gives everything to save traffic and time to display the template, a small and easy library that will help better templify the application. Focuses more on CSS instead of using animation. (The author's literal "water" - transl.)
templayed.js
This is the smallest template engine you’ll come across, guaranteed ( Nano ) . It is built on the basis of Mustache, easy to use and understand. The site has a large demo example in which you can run and test the code.
Ect
Like templayed, ECT also has installation demos on the site, with which you can “play around” and watch live results. It is made for speed, and declares itself as the fastest templating engine for JS (built on Coffeescript). Compatible with Node.js and has clear syntax. There are benchmarks and unit tests on Github showing the effectiveness of this library.
Pithy.js
There is an internal DSL for generating HTML in JavaScript. This is great for small front-end projects, but not recommended for heavy HTML pages.
T.js
T.js uses a simple Javascript data structure to represent HTML / XML data.
Nunjucks
created in Mozilla, Nunjucks is made for those who need performance and flexibility due to the ability to extend the user library of plugins and functions.
Jade
Jade is designed primarily for server templates in node.js, but can work in many other environments. It is made only for XML-like documents (HTML, RSS, ...), so do not use it for the design of plain text, markdown, CSS and similar documents.
Dust.js
Dust expands Mustache and offers high quality performance compared to other solutions from this list. Contains a very simple and straightforward API.
Javascript templating engines
I did not try to give examples, because the many links to the official pages contain demonstrations.
Hope you could discover new options for your next project. I am sure that many alternatives are not mentioned, but the use of these is felt most of all.
UPD : original article commentators added :
- " Pure - Simple and ultra-fast templating tool to generate HTML from JSON data
- Dust.js framework is used in their Kraken.js framework.
- Swig - A simple, powerful, and extendable JavaScript Template Engine.
UPD2 : mentioned in comments for this article :
Source: https://habr.com/ru/post/219873/
All Articles