What is the best alternative to Webix?

Question

Built By the Slant team

Find the best product instantly.

4.7 star rating

Try it now - it's free

score 520 · Answer 1

Vue.js

Top 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. See More

Top Con

Poor typescript support

Very basic typescript support. See More

Top Pro

Single file component

Very useful. See More

Top Con

Very enterpris-ey in design and tooling

Top Pro

Lightweight

Vue.js weighs in at 16kb min+gzip. See More

Top Pro

Vuex store, events system

Top Pro

Reactivity system

Top Pro

CLI and Webpack integration

Top 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. See More

Top Pro

Supports inline templating

Although you can build components in JavaScript files, you can also use inline handlebars-like templating in your HTML views where simplicity is often a more sane choice. See More

Top 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. See More

Top 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 render function. Or alternatively, you can embed functions inside templates by using the <render> tag. See More

Top 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. See More

Top Pro

VueRouter

Specs

GZipped size:~30KB

Repository:https://github.com/vuejs/vue

See All Experiences

520 128

score 12 · Answer 2

Syncfusion JavaScript UI Controls

Top Pro

Modular and written fully in TypeScript

All components have been built as modules to enable selective referencing, so only the components and features you need are included in your application. See More

Top Pro

Responsive and Touch friendly

All controls are touch friendly and render adaptively based on the device they are on to provide optimal usage experience on phones, tablets and desktops. See More

Top Pro

Built-in themes

All 4 major themes are available such as Google's Material, Bootstrap, High contrast and Office 365's Fabric themes. See More

Top Pro

Fast release cycle

4 major releases per year and weekly patch release. See More

Top Pro

Free community license

12 0

score 246 · Answer 3

React

Top Pro

Easy to reuse components

Since every single UI component is created independently in JavaScript, it becomes very easy to reuse them throughout your app without having to re-write them. See More

Top Con

Heavy on memory

React's virtual DOM is fast, but it requires storing elements in the virtual and real DOM increasing memory usage for the page. This can be a real problem for single-page webapps designed to be left running in the background. See More

Top Pro

Supported by Facebook and Instagram

React is built by Facebook engineers initially to be used only for their inner projects especially to solve the problem of building large complex applications with constantly changing data. See More

Top Con

Template(view) mixed into code

Top Pro

Server side rendering

React can render it's components and data server side, then it sends those components as HTML to the browser. This ensures faster initial loading time and SEO friendliness out of the box, since it's indexed as any other static website by search engines. See More

Top Con

Verbose

React gets a little verbose as applications get more complicated with more components. It's simply not as straightforward as simply writing HTML and JavaScript would be. See More

Top Pro

Virtual DOM support

Instead of relying on the DOM, React 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. See More

Top Con

You have to learn a new syntax

Requires learning a custom syntax, JSX, that has some gotchas and introduce complexity, a steeper learning curve, and incompatibility with other tools. Though you can opt out from JSX and use vanilla JS instead. But that is not recommended since it adds a lot of unneeded complexity which JSX tries to avoid. See More

Top Pro

One-way data flow

React's one-way data binding (or one-way data flow) means that it's easy to see where and how your UI is updated and where you need to make changes. It's also very easy to keep everything modular, fast and well-organized. See More

Top Con

Not a complete solution

React does not do everything for the developer, it's merely a tool for building the UI of a web app. It does not have support for routing or models, at least not out of the box. While some missing features can be added through libraries, to start using React and use it in production, you still would need to have experience, or at least a good grasp on what the best libraries to use would be. See More

Top Pro

Can be used with different libraries

ReactJS can be used independently as the only library for building the front-end, or it can be used alongside JavaScript libraries such as jQuery, or even Angular. See More

Top Con

Large file size

React's react.min.js is 145.5KB in size. It's much larger than some other libraries that offer roughly the same features and it's almost the same size as some MV* frameworks such as Angular or Ember that offer more features out of the box. Although, it should be mentioned that sometimes having a smaller library may force developers to reinvent the wheel and write inefficient implementations on features that React already has. Ending up with a larger application that's harder to maintain and/or that has bad performance. See More

Top Pro

Template engine independent

React provides a template engine (JSX) which is easy to use. But it's not mandatory. See More

Top Con

Renders too frequently

Top Pro

Widely used

The framework is widely used in the industry. See More

Top Con

No support for legacy browsers

React has recently dropped support for Internet Explorer 8. While the library may still work on IE8, issues that affect only IE8 will not be prioritized and/or solved. See More

Top Pro

Functional programming style leads to less buggy UIs

Top Pro

Easy to write tests

Since React's virtual DOM system is implemented completely in JavaScript, it's very easy to write UI test cases. See More

Top Pro

Good debugging tools

React has an official Chrome Extension which is used as a developing and debugging tool. It can be used to quickly and painlessly debug your application or view the whole application structure as it's rendered. See More

Top Pro

Flux architecture pattern

Flux is a platform agnostic pattern which can technically be used with any application or programming language. One of Flux' main features is that it enforces uni-directional data flow which means that views do not change the data directly. With React this is useful because this way it's easier to understand an application as it starts getting more complicated. By having two-way data binding, lead to unpredictable changes, where changing one model's data would end up updating another model. By using the Flux architecture, this can be avoided. See More

Top Pro

Extensive SVG support

Since React v0.15, SVG is fully supported. React supports all SVG attributes that are recognized by today's browsers. See More

Top Pro

Keep control over your app's logic

React is just a view library, so you still have (almost) full control over how your app behaves. See More

Top Pro

Supported by ClojureScript libraries

Reagent, Om, Rum, etc. See More

Top Pro

Tested on Facebook itself

React is used on one of the most visited websites on the planet, Facebook. With stellar results and with millions of people experiencing it every day. See More

Specs

GZipped size:45K

See All Experiences

246 101

score 101 · Answer 4

Polymer

Top Pro

Various basic components

It provides a base component. See More

Top Con

No server-side rendering

Polymer does not support server-side rendering. This results in higher loading times, more HTTP requests and it's not very SEO friendly, since search engines have no way of indexing a page if it's not rendered in the server. See More

Top Pro

HTML markup is not string

HTML markup as it can be a non-string. See More

Top Pro

Flex layout components

It provides Flex layout components. See More

Top Pro

CSS is easy to apply

CSS can be applied far more comfortably than React. See More

Top Pro

No need for special debugging tools

The presence od specialized debugging tools are advertised by competitors. The all features of web components are natively supported by browser embedded development tools. See More

Top Pro

Excellent routing

The router is embedded into CLI for project creation and covers as web as Progressive web app, also fused with Polymer layouts out of the box. The shop template for CLI has a complete solution including the routing. See More

Top Pro

Complete web app stack support

Full app stack from data tier to routing, progressive web app, responsive layouts makes no need to seek outside of Polymer ecosystem for application features. In addition to waste set of mature web components in Polymer Elements along with Vaadin Elements there are thousands of web components in the wild comparable to jQuery plugins set. See More

Top Pro

Excellent documentation

Polymer guides you as with tools (cli, build environment, app templates,..) as with complimentary documentation on all phases of app development from creation of app as progresive web app to production deployment instructions. As Polymer is standards based, the whole community around those standards also helping in documentation and support. See More

Top Pro

Based on web components

Web Components are a collection of specifications released by W3C as a way to reduce the complexity of web apps by creating reusable components. Browser support is currently poor for web components, however Polymer is developed to make web components compatible with modern browsers. See More

Top Pro

API is easy to understand, based on standard

The Polymer APIs are split on application layers and follow standards on all possible ways: Web Components, CSS variables, async API via Promises and so on. See More

Specs

v2.0 GZipped size (Chrome):10K

v2.0 GZipped size (Safari):13K

v2.0 GZipped size (Edge):36K

v2.0 GZipped size (Firefox):32K

See All Specs

See All Experiences

101 22

score 10 · Answer 5

Deku

Top Pro

Functional

Functional approach. See More

Top Con

No support for legacy browsers

Deku does not support legacy browsers, or relatively old browsers for that matter. They only support the latest versions of the major web browsers. See More

Top Pro

Server side rendering

Deku can render it's components and data server side, then it sends those components as HTML to the browser. This ensures faster initial loading time and SEO friendliness out of the box, since it's indexed as any other static website by search engines. See More

Top Con

Not a lot of learning resources

Since it's a rather new library and has a small community, there are not many examples where you can learn from out there. There are also few guides and the documentation is not amazing and has some parts that should be covered better. See More

Top Pro

Easy to learn

Since Deku is very lightweight and has a rather small API, there's not much to learn. It's pretty easy to get started and build something with it. See More

Top Pro

Can use JSX

Developers using Deku can choose to also use JSX if they want to. This is especially helpful for people who are moving from React to Deku. See More

Top Pro

Good performance

Deku's diffing algorithm is considerably faster and performs better than most libraries. The dbmonster performance mini-app written in Deku renders roughly 16% faster than other libraries. See More

See All Experiences

10 2

score 92 · Answer 6

Ember.js

Top Pro

Excellent routing

Route handlers for the URLs can see a wide range of possible application states, asynchronous logic in the router makes sure of Promises. And implementing makes sense. See More

Top Con

Steep learning curve

Ember.js has a rather steep learning curve for beginners. See More

Top Pro

Increased performance because similar tasks are processed in one go

It batches bindings and DOM updates to increase performance; if similar tasks are added to a batch, the browser would only need to process them in one single go, as compared to re-computing for each task one at a time. See More

Top Con

Too large for small projects

At 69Kb gzipped, it is one of the largest JavaScript frameworks. This means Ember might be an overkill to use on simpler projects. See More

Top Pro

The API is easy to understand

Ember's API are really easy to understand and work with. It has methods which allow you to harness complicated functionalities in an easy to understand way. See More

Top Con

More Ruby than JavaScript

It was written as a Ruby on Rails for JavaScript. Ends up being very frameworky and having tons of polyfills and unneeded abstractions. See More

Top Pro

Helps with writing simple and modular code by using Promises

Promises represent an eventual state in asynchronous logic. Having promises everywhere (almost) means you could write simple and modular code, using almost any API that Ember provides. See More

Top Pro

Easy to understand documentation

The Ember Guides are well structured and very well written. The API documentation is also fantastic. See More

Top Pro

Complete front-end stack

Ember is practically a complete full-stack front-end framework. It comes with it's own asset pipeline, router, services etc... See More

Top Pro

Minimal need for configuration

Ember follows the philosophy of "convention over configuration" meaning that it already has almost everything configured for you, so you just have to start coding and developing your project right away. See More

Top Pro

Built-in router

Ember comes with built-in routing capabilities. There's no need to install third-party plugins to be able to use routes. See More

Top Pro

Debugging tool for almost every web browser

Ember also has a debugging tool called Ember Inspector which is used for debugging the client side of your app. See More

Top Pro

Helps developers with keeping the structure of the application clean and simple

Ember already defines the general application structure and organization for you. This was done to prevent developers from making mistakes which would needlessly over-complicate their application. While it's still possible to go out of these practices forced to developers by the Ember authors, you still have to go out of your way to force them. See More

Top Pro

Out-of-the-box CLI tool which scaffolds a new project

Ember-CLI is a very useful tool. With just a couple of commands it scaffolds the code, installs dependencies and finally compiles everything itself. It's very useful to quickstart an Ember project. See More

Top Pro

Uses a relatively clean and easy to understand templating engine

Ember's preferred templating language is Handlebars. This is mainly because Handlebars is a logic-less templating language and Ember tries to keep it's logic outside the view. Another reason why Ember benefits from Handlebars is mostly aesthetic as Handlebar's clean syntax makes for easier to read and understand templates. Finally, Handlebars templates are compiled instead of interpreted, which means that they are much faster to load. See More

Top Pro

Works great with jQuery

You can use any of jQuery’s features. See More

Top Pro

Useful bindings

EmberJS provides with an extremely handy feature of advanced bindings. With this you can not only set the path to the binding value in your app but also set in which direction you want the changes to propagate to (oneway, single, multiple etc). See More

Top Pro

Can render the page according to any of the developer's needs because of computed properties

Having custom properties in your templates is itself a huge plus but having custom computed properties is an even greater benefit, since now you can code your custom function as a property and call it from your template. Hence rendering your page exactly according to your needs. See More

Top Pro

Auto-updating templates

If you've used handlebars (Ember.js's templating is powered by HandleBars) helper tags in your code (like {{#each}}) you won't have to worry about updating your template each time you add/remove data from your page, Handlebars will auto update your template for you. See More

Top Pro

Stunning developer experience

You build products instead of constantly configuring the stuff. See More

Top Pro

Uses Glimmer 2, a very fast template rendering engine

Glimmer 2, a new and very fast template rendering engine written in TypeScript, is fast due to smaller precompiled template sizes, faster parsing and initial render, and compiles at runtime to extremely efficient assembly-like append opcodes. See More

Top Pro

Ember's Object model makes the framework extremely consistent

Most of Ember's components come from the Ember Object Model. It's the basis for views, controllers, models and even the framework itself. This means that the framework is extremely consistent since almost every component shares the same core functionalities and properties since they are all derived from the same object. See More

Top Pro

Excellent data layer

Ember provides a built-in data layer, which makes it super simple to keep the UI in sync with the back end. See More

Top Pro

Continually evolving

Ember has a great core team and community of developers who are continually improving, updating and evolving the framework. The Ember team is always planning ahead and implementing the best of the latest technologies and practices, while ensuring backwards compatability. See More

Specs

Price:Free

See All Experiences

92 15

score 9 · Answer 7

w2ui

Top Pro

Easy and clean API

Any component is well documented and have an easy API to access validation, dataloading and handling user events. See More

Top Pro

Lots of components/widgets

Library contains UI components like Datagrids, Forms, Tabs, SideBars, Toolbars and more. See More

Top Pro

Small library size

Only two files need to be included 1 .css and 1 .js, together they are only 365 kb. regarding to amount of components it is very small. See More

9 0

score 198 · Answer 8

Aurelia

Top Pro

Out of the box Typescript support

Full support for Typescript built in See More

Top Con

No big success stories yet

There are no notable big web products build with aurelia yet See More

Top Pro

Good binding system

Clear, intuitive and HTML/SVG compliant binding syntax. Examples: Default binding => value.bind One Way binding => value.one-way Two Way binding => value.two-way One Time binding => value.one-time See More

Top Con

Needs more support from the community

It would be great to have a lot of plugins made by the community, or video tutorials from experiences when using it. Hopefully in the near term future. See More

Top Pro

Conventions over configurations

Configured to give you the most common use cases by convention, which means you only need to change the default configuration for edge cases. This means that for normal cases far less boiler plate code has to be written. See More

Top Con

Two-way data binding is often considered an anti-pattern

Two-way data-binding means that a HTML element in the view and an Angular 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. See More

Top Pro

Out of the box ES6 support

Aurelia includes native support for ES6 and even comes with a Gulpfile which helps with transpiling ES6 code to ES5. See More

Top Pro

Allows developers to build their application however they want

Aurelia is extremely unopinionated and was designed to be highly modular. This gives the developer the freedom to develop their application however they want, without forcing them in paradigms or rules predefined by the framework. Likewise, any of the individual components can be swapped out if so desired. See More

Top Pro

Standards compliant

Aurelia developers always try to keep within existing and emerging Web Standards, making it easier for developers to follow best practices in web development. See More

Top Pro

Agnostic code

Most of the code you write is Aurelia-agnostic. It's one of the closest libraries that you'll find to basically write plain-old, vanilla Javascript or TypeScript code (classes) and doesn't polluate your HTML/SCSS. That way you can easily test it, switch to another implementation and make it look clean (business oriented). Even the HTML. See More

Top Pro

Easy to learn

Learning aurelia basically means learning EcmaScript and HTML, since aurelia is designed for standards compliance. Also, aurelia embraces upcoming ES language features by convention, such as ES class decorators for dependency injection, encouraging clean architecture and future-proof code. See More

Top Pro

Variable binding helps with self-documenting the code

The syntax used to bind variables within the application class is very similar to Javascript itself. You can specify the type of the binding you are using explicitly, which practically self-documents your code and makes it easy to understand whether a value is one-way or two-way binded. See More

Top Pro

Structure

Aurelia.js consists of modules that can be used as a full framework or separately. See More

Top Pro

Great documentation

One of the most crucial pieces of any new technology or framework is the documentation. At present even though Aurelia is pre-beta, the documentation is pretty complete. There are code examples missing and whatnot, but for the most part it is concise and makes the main parts of the application easy to understand. See More

Top Pro

Full commercial support

Aurelia is officially backed by Durandal Inc. and has commercial and enterprise support is available. See More

Top Pro

Data binding choices with sane defaults

Aurelia defaults to one-way data binding, alining with conventional wisdom. However, there are times when two-way data binding proves useful, such as binding an input widget with a view-model. Aurelia makes two-way data binding available to developers and uses it by convention when appropriate. See More

Top Pro

Plays well with other frameworks

Aurelia can be used alongside of React and Polymer, since it is designed for interoperability. In practice, this means Aurelia developers can use React components by including an Aurelia custom element: https://github.com/Vheissu/aurelia-react-example/blob/master/README.md It also works well with Polymer, since they are both based on the WebComponents standards: http://aurelia.io/hub.html#/doc/article/aurelia/framework/latest/integrating-with-polymer See More

Top Pro

Powerful helper CLI available

https://github.com/aurelia/cli The CLI helps rapid creation of projects with generators, building, deploying and hot reloads. Webpack should be coming soon. See More

Top Pro

Growing community

The Aurelia community is growing at a great pace. Still doesn’t rival the big players line Angular or React, but the answer to an Aurelia issue is a quick question away on their Discourse. See More

Top Pro

Provides dependency injection

With dependency injection, you can load in extra javascript and new functionality just when you need it. This is particularly helpful with testing as you can swap out services for test services. It also means in single page apps you can load dependencies only as you need them instead of loading them up all up at the start. See More

Specs

GZipped size:~67kB

Repository:https://github.com/aurelia/aurelia

Minified size:~237K

See All Experiences

198 29

score 8 · Answer 9

Blocks.js

Top Pro

Small footprint

Blocks.js is just 16.5KB minified and gzipped. So it's pretty small. See More

Top Con

Relatively new

Blocks.js is a relatively new library. It doesn't have much support and there re not many people who use it. So if you run into any problems it would be hard to get solutions. See More

Top Pro

Modular structure

Apps developed with blocks.js are modular in structure and make use of reusable objects. This makes these applications very maintainable. See More

Specs

GZipped size:16.5K

8 0

score 6 · Answer 10

CanJS

Top Con

Hard to find resources outside of the official ones

Since CanJS is not very popular, it can be hard to find learning resources, tutorials, guides or any other resource that may help development. See More

Top Pro

Fast rendering

Update of single element, no diff like react. See More

Top Pro

Compact and easy syntax

CanJS has an easy to learn syntax. See More

6 0

score 29 · Answer 11

Marko Widgets

Top Pro

Very fast on the server

Using Marko and Marko Widgets to render UI components on the server was shown to be 10x faster than React. A benchmark application was built using both Marko+Marko Widgets and React and the results of rendering a page of 100 search results on the server was measured and compared. Both the Marko Widgets code and the React code used a very similar UI components-based appraoch. See More

Top Pro

Stateful UI components

Marko Widgets supports stateful UI components. Marko Widgets will automatically rerender a UI component if its internal state changes. A UI component's state is stored in the this.state property that is a vanilla JavaScript object. All changes to the state should go through the this.setState(name, value) method (or this.replaceState(newState)) See More

Top Pro

Very fast in the browser

Marko Widgets utilizes the morphdom module for updating the DOM and that module was shown to be very competitive with React and virtual-dom. See More

Top Pro

The real DOM is the source of truth

Marko Widgets does not rely on a virtual DOM abstraction. Instead, the real DOM is always the source of truth. When updating the DOM, the newly rendered DOM is compared with the real DOM. See More

Top Pro

DOM diffing/patching

Marko Widgets updates the DOM using a DOM diffing/patching algorithm to minimize the number of changes to the DOM when rerendering a UI component due to state changes. The DOM diffing/patching is handled by the independent morphdom library. See More

Top Pro

Simple JavaScript API for rendering a UI component

The following code illustrates how the render(input) method exported by a UI component's JavaScript module can be used to render a UI component and insert the resulting HTML into the DOM: require('./app-hello') .render({ name: 'John' }) .appendTo(document.body) See More

Top Pro

Batched updates

Updates to the DOM are deferred until all state changes have completed for the current tick. That is, changing a widget's state will not cause the UI component's DOM to immediately be updated. See More

Top Pro

Declarative eventing binding

Marko Widgets offers a simple mechanism for declaratively binding DOM event and custom event listeners to widget handler methods. For example: <button type="button" w-onClick="handleClick"> Click Me </button> And then in the JavaScript: module.exports = require('marko-widgets').defineComponent({ // ... handleClick: function(event, el) { this.doSomething(); } }); See More

Top Pro

Marko templating engine for the view

Marko is a fast and lightweight, general purpose HTML-based templating engine that compiles templates to CommonJS modules and supports streaming, async rendering and custom tags. Marko is used for rendering UI components and Marko Widgets is used to bind client-side behavior to rendered UI components. Marko can be used independently of Marko Widgets and this makes it suitable in all situations where HTML rendering is needed. See More

Top Pro

Efficient binding of behavior for UI components rendered on the server.

When utilizing server-side rendering of a UI, Marko Widgets does not require that the UI be rerendered again in the browser just to bind behavior. Instead, extra information is passed down from the server to the client to allow Marko Widgets to efficiently bind widgets to UI components rendered on the server. See More

Top Pro

Lightweight (~10 KB gzipped)

The runtime for Marko Widgets is extremely small. The runtime is very small and this makes Marko Widgets much simpler and easier to understand and debug. Marko Widgets offloads much of the work and complexity to compile time code so that the work required at runtime is minimal. See More

Top Pro

Easily reference nested DOM elements and nested widgets

Marko Widgets supports the concept of "scoped" IDs. With scoped IDs, a nested DOM element or nested widget can be given an ID that is unique within the scope of the containing widget. At runtime the actual ID will be the scoped ID prefixed with the ID of the parent widget. A reference nested widget can be obtained using the this.getWidget(scopedId) method and a reference to a nested DOM element can be obtained using the this.getEl(scopedId) method. For example: <div class="my-app" w-bind> <button type="button" w-onClick="handleButtonClick"> Click Me </button> <alert-overlay visible="false" w-id="alert"> This is a test alert. </alert-overlay> <div w-id="clickMessage" style="display: none;"> You clicked the button! </div> </div> And then in the JavaScript code: module.exports = require('marko-widgets').defineComponent({ // ... handleButtonClick: function(event, el) { var alertWidget = this.getWidget('alert'); // Call the `show()` function implemented by the alert widget: alertWidget.show(); var clickMessageEl = this.getEl('clickMessage'); clickMessageEl.style.display = 'block'; } }); See More

Top Pro

Efficient event delegation

Marko Widgets supports efficient event delegation to avoid attaching DOM event listeners to each DOM node. Instead, Marko Widgets attaches event listeners on the document.body event for events that bubble. Events captured at the root are efficiently delegated out to widgets. See More

Top Pro

UI components can be embedded in a Marko template using a custom tag

The following code illustrates how a UI component can be embedded in a Marko template: <div> <app-hello name="Frank"/> </div> See More

Specs

GZipped size:39.1 kB

See All Experiences

29 10

score 19 · Answer 12

Inferno

Top Pro

Modular

Use it however you want in a framework of your own custom design. When things change in the industry, swap things out instead of being locked in by someone else's design. See More

Top Con

Some React components may not work with Inferno

Inferno and React have different public and private APIs. If 3rd party components use a private API then it's almost certainly going to break when you use it with Inferno. Once React Fiber is implemented, even libraries that are currently working will break and will not be supported by Inferno. See More

Top Pro

Pretty light-weight

Inferno weighs in at 9kb gzipped, which is light-weight. See More

Top Con

Not very popular

Which can hinder one's opinion of its future, but the future of all "frameworks" is to break things into smaller pieces, so inferno very well might get used by the big names in the future. See More

Top Pro

Fast performance

Inferno is one of the fastest UI libraries around and widely considered the fastest. See More

Top Pro

React compatability

Using the Inferno compatibility package ("inferno-compat"), Inferno can support the vast majority of React codebases. See More

19 1

score 128 · Answer 13

Riot

Top Pro

Minimal DOM operations

Riot takes the expressions from a DOM tree and stores them in an array. Each of these expressions points to a DOM node. On each cycle these expressions are compared to the values in the DOM. So when a value has changed, Riot automatically updates the corresponding node. This way the operations are kept to a minimal amount and since the expressions can be cached, going through 1000 of them takes less than 1ms. See More

Top Pro

Lightweight

Riot is made to be used with websites of any kind, so it's built to be easy and lightweight, but still maintaining all the needed features for a UI library. It's only 2.5 KB in size when minified. So it can also be used for mobile web apps without requiring much bandwidth to download. See More

Top Pro

Components use familiar HTML tags

Riot components use custom tags which are nothing more than familiar HTML tags coupled with JavaScript. This eliminates the need to learn another templating language or syntax. For example: <todo> <h3>TODO</h3> <ul> <li each={ item, i in items }>{ item }</li> </ul> <form onsubmit={ handleSubmit }> <input> <button>Add #{ items.length + 1 }</button> </form> this.items = [] handleSubmit(e) { var input = e.target[0] this.items.push(input.value) input.value = '' } </todo> Riot tries to separate HTML and JavaScript, while still keeping them inside the component. This way, the HTML can also be neatly mixed with JavaScript expressions. See More

Top Pro

Supports server side rendering

Riot has support for server side rendering. The views and data are rendered on the server, then those views are sent as HTML to the browser when a user requests them. This helps with initial loading time and is very useful for SEO purposes because the web app is indexed by search engines same as other static websites that have their HTML on the server. See More

Top Pro

Easily pluggable with JS/HTML/CSS preprocessors

It is very easy to use your favorite preprocessors with the Riot compiler. Riot comes with CoffeeScript, ES6 (Babel), TypeScript, LiveScript and Jade support. You can also add your own parsers. See More

Top Pro

Very simple

It makes React look confusing as hell. Nothing against React - It's just that easy to implement! See More

Top Pro

Scoped CSS available in components

Riot supports scoped CSS inside components for every browser by rewriting stylesheet rules. See More

Top Pro

Lives well with any other library, framework and usage pattern

Since it's not opinionated, even the scripting can be in anything that can be transpired to JavaScript. See More

Top Pro

Separation of concerns with RiotControl

RiotControl is inspired by Facebook's Flux Architecture Pattern and it's a simple Central Event Controller/Dispatcher for Riot. It's extremely lightweight (like Riot itself) but unfortunately passes up on some features in favor of performance and simplicity. RiotControl helps with storing the stater of the application, by passing events from views to stores and vice-versa. Stores can communicate with many views and views can do the same with many stores, this enables to clearly separate concerns and inter-component communication. See More

Specs

Platforms:Android, iOS, Web, Linux, macOS, Windows, Electron

License:free open-source software

Search:yes

End-to-end encryption:yes

See All Specs

See All Experiences

128 46

score 68 · Answer 14

Angular

Top Pro

Support for a composable component oriented architecture with directives

Angular uses the existing HTML structure and builds on top of it instead of requiring you to learn a new templating language. Because it's just vanilla HTML, it is more familiar, and easier for beginners to learn. Directives let Angular know which HTML elements are under its control, and how to use them. Being directly on the HTML it's more transparent what's going on, and it's possible to get a good idea of what the page is doing just by looking at the template. Also, it makes embedding possible, as you could have an angular app within an existing site so you don't have to rewrite everything at once. See More

Top Con

Steep learning curve

Angular isn't a simple framework, and because much of the magic goes on behind the scenes, it isn't easy to go from simply using the framework to being able to actually change how it works and extend it. See More

Top Pro

Provides dependency injection

With dependency injection, you can load in extra javascript and new functionality just when you need it. This is particularly helpful with testing as you can swap out services for test services. It also means in single page apps you can load dependencies only as you need them instead of loading them up all up at the start. See More

Top Con

It is almost mandatory to use Typescript

Although ES standard can be used, most of the documentation and resources are with Typescript. See More

Top Pro

Easy and straightforward data-binding

Data bindings are done on the DOM, which allows you to easily sync data between various parts of the DOM in a very succint matter. <body ng-app> <span>Insert your name:</span> <input type="text" ng-model="user.name" /> <h3>Echo: {{user.name}}</h3> </body> This snippet shows how the model attribute "name" is easily bound across different parts of the DOM without having to set up any extra boilerplate. See More

Top Con

HTML template does not comply to standards

Attributes are case-sensitive, which is against the HTML standards. See More

Top Pro

Huge ecosystem of third party components

Angular is an extremely popular JavaScript framework. Because of this, developers have developed a myriad of components which can be downloaded and integrated into any Angular application. See More

Top Con

Difficult to use for isomorphic apps that render the initial template on the server in a performant way. Non issue for enterprise apps.

Top Pro

Huge community that is quickly growing

Angular has the largest community out of all Javascript MV* frameworks and there are a lot of tutorials and guides out there for new and old users alike. See More

Top Con

Explicit configuration

Users will usually need to specify stuff that is very obvious (template location, providers etc. ). See More

Top Pro

All best practices

Top Con

Two-way data binding is often considered an anti-pattern

Two-way data-binding means that a HTML element in the view and an Angular 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. See More

See All Experiences

68 37

score 10 · Answer 15

Livegap charts

Top Pro

Free

Tool to easily create beautiful chart from any data then save as image or animated HTML Charts See More

Top Con

No candlestick charts

Top Pro

Charts can be exported to multiple formats

Charts can be exported to images or HTML. See More

Top Con

No gantt chart

Top Pro

Can be opened from the browser

The tool is online and can be used from a web browser, no application is needed. See More

10 1

score 114 · Answer 16

Chart.js

Top Pro

Lightweight and fast

The library contains a set of 6 charts and is 11Kb gzipped, this makes its loading time and page impact low. See More

Top Con

Limited features

Chart.js currently offers only 6 graph types, and lacks the flexibility offered by other options. For example, controlling the display of tooltips is fairly limited. See More

Top Pro

Responsive charts

The charts are fully responsive, meaning they resize based on the viewport width. See More

Top Con

Canvas based

Canvas it bitmap based and shares the same issues as non-vector formats. See More

Top Pro

Clear documentation

The chart.js documentation is well organized and provides detailed information on using each feature. See More

Top Pro

Plugin support

Many plugins available via NPM and you can easily write your own See More

114 9

score 91 · Answer 17

Mithril

Top Pro

Small, easy to learn API

Most other frameworks either offer a huge API to deal with model and view synchronization, or defer to other libraries & plugins to cater for relatively simple use cases. Mithril's API is tiny but complete. The natural reaction is to assume something is missing, but as you build you realise you incredibly fast, powerful and rich applications can be built using nothing but Mithril. See More

Top Con

Small API can make it unsuitable for larger more complex projects

Mithril's small API and small number of functions while helpful for small projects and applications where speed is needed, can add another layer of complexity in larger more complex applications where a more extensive API is needed out of the box. See More

Top Pro

Fast rendering

Mithril's loading times are very fast. This is because it's templates are compiled first and then served to the browser and because it uses a virtual DOM. The virtual DOM is a virtual tree containing all the nodes of the real DOM, every time anything changes in the virtual DOM, Mithril does not re-render the entire (real) DOM, instead it just searches and applies the differences. See More

Top Pro

No need to learn another syntax to write views

Most MVC frameworks use HTML templates to render their views. They are good and useful because they are easy to read and understand. But they add more complication to an app because it's practically a new language and syntax that needs to be learned. Mithril argues that separating markup from logic is just a separation of technologies and not concerns, so you can write Mithril views in JavaScript. Writing them in JavaScript also makes it easier to debug them (HTML templates can't be debugged). See More

Top Pro

Familiar to people used to MVC

Doesn't lock you into any complicated conventions or structures, only one function is required to create either a Controller or a View. You're free to implement your architecture exactly as you want, so you can focus on the purpose of MVC, making connections between computer data and stuff in the end user's head. See More

Top Pro

Small size

Weights just 8Kb gzipped and has no dependencies. A reactive stream module can be added for one extra Kb. See More

Top Pro

Great documentation

Mithril has a large and expansive documentation despite it's relatively small API. Mithril's GitHub repo has more documentation than actual source code. None of that documentation is auto-generated See More

Top Pro

Allows a smooth transition from other UI frameworks

One thing you need to start using Mithril is just a DOM node. With Mithril a developer is able to introduce the library step by step. See More

Top Pro

Allows you to choose which JavaScript libraries to integrate in your project

Mithril gives to the developer the flexibility to chose the best JavaScript library to use for a specific task. A huge framework like Angular instead forces you to use their API, which does not necessarily evolve as fast as the JavaScript ecosystem. Therefore you may end up in case when you are stuck using an API which is just not the best in terms of performance See More

Top Pro

Can be used without build systems

It's plain old JavaScript, can be used without webpack, gulp or grunt, just include it into your HTML and start writing your app. See More

Top Pro

Does not force you into a predefined structure

Mithril's API is pretty small compared to other frameworks. It forces developers to solve problems in JavaScript rather than in Mithril. Other frameworks with massive APIs force you to think in a way that suits the framework. Mithril doesn't do that. See More

Specs

GZipped size:8kb

See All Experiences

91 8

score 28 · Answer 18

Kendo UI

Top Con

Expensive commercial tools [$699, $1,499]

The other core tools developed with Kendo are the commercial tools. There is the Professional version for $699 that will result in more jQuery UI widgets and client support. The $1499 "DevCraft" Complete edition gets developers the DevCraft .NET toolbox, testing and debugging frameworks and applications, as well as priority support. See More

Top Pro

Free Core tools

Kendo UI is separated into a commercial and open source frameworks. The core of Kendo UI is in the open source frameworks, but some usability and benefits of Kendo UI are lost without the commercial version. See More

Top Pro

Platform-based UI

Kendo knows what device it is being viewed on so it can adjust the UI accordingly. If a user is on a PC the user will see things differently than on a mobile device. Between iOS and Android the user will also notice a different as it pulls from the core UI of those core systems. See More

Top Pro

Theme Builder

An interactive tool that has been created to customize an apps theme. Users are able to select from many pre-defined themes, edit them, and download the theme to bring into a project. See More

28 5

score 77 · Answer 19

Knockout

Top Pro

Easy data binding

Knockout uses HTML5 data attributes to bind HTML elements to data objects in javascript. This allows more work to be done by the framework rather than requiring you to specify where data should be bound in the javascript. The data binding is very intuitive as the bindings are done within the HTML itself in the location it should be bound. See More

Top Con

Slower than others when amount of objects grows

Knockout has a bad performance when the dealing with large amount of objects. You can see more here. See More

Top Pro

Easy to learn

Has a low entry barrier and an easy learning curve. It's especially easy to learn for beginners. See More

Top Con

Can become complex once the application grows large

Knockout leaves the application structure to the developer and it can become quite complex and unmanageable in the hands of a beginner once the application grows large and complex. See More

Top Pro

Built in templating

Bindings in Knockout can also be used to control the generated structure of the HTML. There are bindings provided to allow for iteration and conditionals. The structure of the html reflects the structure of the data so iterative elements are bound to arrays in the data model. Having the HTML structure maintained by bindings keeps the templating simple, easy to read, and maintain. Knockout also allows for string based templating so you can use whatever templating library you prefer. See More

Top Con

Two way binding requires a little extra work

When allowing users to edit existing data, the two-way binding of observables means you'll need to have to save original values before they're edited, to make comparisons or revert if the user cancels the action. See More

Top Pro

Legacy browser support

Supports a large number of browsers, including IE6. See More

Top Pro

Great documentation

The excellent tutorials with built-in exercises are a great learning experience, even for people without prior MVVM and data binding experience. See More

Top Pro

Lightweight and plays nicely with other libraries

Top Pro

Dynamic models help with keeping the code simple and clean

Models in Knockout can be watched to keep the page data up to date by using observable objects. The observables notify Knockout when data is changed and automatically updates the page when this happens. By having Knockout maintain this relation, it keeps the front end code cleaner and simpler, and by enforcing a consistent pattern with observables the methodology can be more robust. See More

Top Pro

Very flexible

One can do a lot of things and it keeps self references and other types of loops under control. See More

Top Pro

It's only a library

Knockout does one thing, and does it well. It doesn't try to take on more than one area. It does MVVM data binding and that is it. See More

Top Pro

Simple manageable modules

Using components is a great way of breaking up large modules into simpler ones. See More

See All Experiences

77 14

score 26 · Answer 20

Preact

Top Pro

Lightweight

The size when gzipped is only 3kb, and performance is as good as (or even faster than) React itself. See More

Top Con

Difficult to learn

You need to be good in React JS first to learn Preact. Documentation is not rich. And some of the examples given on site are not working. Developers are not much active on Stack Overflow as well. See More

Top Pro

Same API as react

Avoids having to learn an entire new paradigm, and makes it easy to switch between the two libraries later on. See More

Top Pro

Lots of examples and libraries

They have a bunch of examples and addon libraries. See More

Top Pro

Awesome CLI

Preact CLI gives you a perfect scoring PWA out-of-the-box with no configuration. See More

Specs

Current stable version:8.1.0

GZipped size:3.3kb

Site:https://preactjs.com

26 6