Add to Chrome
Add to Edge
Add to Firefox
Add to Opera
Add to Brave
Add to SafariRactive.js vs Webix
When comparing Ractive.js vs Webix, the Slant community recommends Ractive.js for most people. In the question“What are the best JavaScript libraries for building a UI?” Ractive.js is ranked 7th while Webix is ranked 8th. The most important reason people chose Ractive.js is:
Ractive fully supports a templating language. To be more precise, views are written with a variant of Mustache, which is also extended to support inline JavaScript expressions. Soon it will be able to support other templating languages.
Specs
Question Ranking
Pros
Pro Supports a true templating language
Ractive fully supports a templating language. To be more precise, views are written with a variant of Mustache, which is also extended to support inline JavaScript expressions. Soon it will be able to support other templating languages.
Pro Makes it possible to handle user interaction in a readable, declarative fashion
Ractive has a concept of proxy events, which translate a user action (e.g. a mouseclick) defined via an event directive into an intention (e.g. 'select this option'). This allows you to handle user interaction in a readable, declarative fashion.on-click='activate'
with arguments:on-click = 'activate: {{a}}, {{b}}'
It's activate (and not click, nor your function name) that is the name of the handler event that will be fired for any registered handlers created viaractive.on('activate', your_handler)ractive.on('activate', your_another_handler)
Of course, Ractive also supports method calls like on-click='toggle(foo)'
Pro Two-way binding configuration
Two-way binding can be turned off by those that are concerned it may be a source of bugs.
Pro Step by step tutorial
They have a great interactive tutorial which makes the learning process easy peasy. You will get into it within a couple of minutes.
Pro Virtual DOM
Instead of relying on the DOM, Ractive implements a virtual DOM from scratch, allowing it to calculate precisely what needs to be patched during the next screen refresh. This is orders of magnitude faster than fiddling with the DOM itself.
Pro A lot of widgets
Webix is one of the most extensive UI component libraries, second only to Sencha ExtJS. Not only considering the number of widgets, but also the API methods for manipulating these widgets.
Pro Views can be constructed using JavaScript without HTML
The most common way of working with webix is to create a JSON configuration of your view in JavaScript. When you use TypeScript, you get complete typechecking and intellisense in your IDE.
Pro Seems to be quite stable
Even the most complicated GUIs are bug-free most of the time.
Pro Webix Jet
The webix Jet library adds all the required features for SPA development (routing, template loading, ...)
Pro Extremely simple to implement.
To get started is extremely simple. It has a low learning curve.
Pro Mature project
Regular updates and releases.
Pro Great support from the webix team
The company behind webix is really quick in answering any questions you have on their forum or via email.
Pro Awesome responsive material skins
Great design and icons pack.
Cons
Con Ractive's two way binding can be a source of bugs
Two-way data-binding means that a HTML element in the view and an Ractive model are binded, and when one of them is changed so is the other. One-way data-binding for example does not change the model when the HTML element is changed.
This is a rather controversial subject and many developers consider two-way data binding an anti-pattern and something that is useless in complex applications because it's very easy to create complex situations by using it and being unable to debug them easily or understand what's happening by just looking at the code.
However, this is the default behaviour which can be changed to have one-way data binding.
Con Commercial license
It's not free for commercial applications.
Con Not very popular
Not really a reason to not recommend it. But it has still a small user base. It deserves a lot more attention.
Con Not modular
The library is not modular (except for some additional more complex widgets). If you only need a few widgets, you still need to include the entire library.
