Ranked in these QuestionsQuestion Ranking
Pro Clean syntax
Pro Easy to read, powerful mixins
Jade supports mixins. These not only make your templating job easier but are also super-easy to read.
Pro Identation reflects nesting
With Jade you can quickly overview the hierarchy of a template.
Pro Easy sublayouts using block and extends
By using the extends and block keywords, sublayouts can be made with intuitive syntax.
Pro High performance on the server and client side
Apart from their functionality all template engines need to be efficient in terms of the time they require to render a page. Jade beats most of its competitors in this area, it is highly optimized to deliver good performance on both the server and client ends.
Pro Preprocessor support
Filters make it easy to embed compiled languages such as coffeescript or markdown directly into the template. A filter will allow you to keep your inline code and content consistent with the rest of your codebase so you can continue using your prefered language with your outputted HTML.
Pro Reuse code in other languages
Pro Interactive documentation
There's an interactive documentation available here that allows you to play around with code examples and watch the results in real time.
Pro Use Markdown for readable markup
Jade is awesome at templating structural markup, but that's not all Jade is awesome at. It also allows you to use markdown within your template itself which will render to a beautiful HTML page.
Pro Can be used with any front-end stack
Vue can easily be integrated with other front-end libraries. This makes it an extremely versatile tool and it's easy to fix its shortcomings or missing features by just plugging in another library.
Vue.js weighs in at 16kb min+gzip.
Pro Single file component
Pro Responsive server-side rendering
Since most of the mainstream server-side rendering implementations are synchronous, they can block the server's event loop when the application is complex.
Vue implements streaming server-side rendering, which allows you to render your component, get a readable stream and directly pipe that to the HTTP response. This allows you to have a responsive server and decreases the time your users have to wait before they get your rendered content.
Pro Supports inline templating
Pro Support for both templates and JSX
You can choose to use either a templating language, or if you feel it's necessary to drop on a lower virtual-dom level, you can use JSX. This is simply done by replacing the
template option with a
Or alternatively, you can embed functions inside templates by using the
Pro Can be made even lighter
Since the template-to-virtual-DOM and compiler can be separated, you can compile the templates in your machine and then deploying only the interpreter which is 12KB minified and gzipped.
Pro Vuex store, events system
Pro CLI and Webpack integration
Pro SEO friendly
Starting with Vue 2.0, Vue supports server-side rendering. This helps with SEO a lot, since the views are rendered directly on the server, which are indexed by search engines.
Pro Reactivity system
Con Cannot copy/paste examples from the internet
Examples from CSS frameworks like Bootstrap are never utilizing the Pug syntax, which means that you cannot ever copy/paste something to quickly see how it would look or if it works. You would have to convert the HTML to Pug first.
Con Unforgiving in case of indentation errors
The structure is entirely determined by the indentation. That means that indentation errors will ruin the end result, often without an easy way to find the error. Indentation errors are easily introduced by copy-pasting, by rearranging code and by working in a team where not everyone uses the same indentation style. (E.g tabs vs. spaces.)
Con Bad performance
Bad sintaxe (Short-hand HTML) and bad performance. No streaming or asynchronous calls. https://github.com/mauricionobrega/nodejs-template-benchmark
Con Performance is not great compared to other popular templating engines
Con Poor typescript support
Very basic typescript support.