Well, here’s the list of our frameworks:
And now, it’s time to look at them closer.
Polymer. All Hail Web Components
Let’s start with this one. Polymer was created by Google, and one of the primary intentions behind it is to provide you with the possibility to craft and use your own Web Components. If you’re not familiar with this term for some reason, you can check this site that will guide you through the world of Web Components to help you understand why hordes of web developers consider them to be the future of the web.
Talking about the future, Polymer uses cutting edge technologies that are not yet present in modern browsers, such as Shadow DOM, Custom Elements, and many others. To make everything work, Polymer suggests the use of polyfills. We can say that this is what Polymer is: a collection of polyfills and syntactic sugar.
Let’s now talk about the available UI elements. Here’s how the Polymer Element Catalog looks like:
The second element of this periodic table is Paper Element, which represents a set of visual elements that implement Google’s Material Design (e.g., controls, layouts, hero transitions, and scrolling effects). You can check this demo page to see what they look like.
There’s also a step-by-step beginner's guide that will help you learn the basics of Polymer and create your first app.
Aurelia. Lightweight Widgets
Here’s the list of main features:
- Written with ES 2016. No external dependencies except polyfills.
- Rather than taking the monolithic framework approach, Aurelia is composed of smaller, focused modules.
- Uses Web Components
- Two-Way Databinding
- Broad Language Support. Aurelia uses ES5, ES 2015, ES 2016, and TypeScript.
It’s also pretty extendable. Since Aurelia is just a series of components, it’s always possible to swap out components that don’t fall in line with your app. You’re free to change the router, or the binding system, or the observation functionality, or anything you want.
Meteor has been called “embarrassingly easy to learn”. It’s very simple to dive into it. Run a couple of commands in your terminal and you get a working basic application. Check the very beginning of this getting started guide if you don’t believe me. Moreover, there’s a possibility to deploy your project to a server using one simple command. You can use it everywhere, test it on different devices, or share it with your friends.
As you can see, Meteor is very friendly to beginner developers, and looking at the supportive community, everyone from code ninjas to rookies should try it.
Webix. Components for Big Web Applications
The Webix developers paid attention to mobile users, providing you with the possibility to create an application that will look and behave fine no matter what device you use. Apps run perfectly on Android, iOS, Windows 8, and Firefox OS devices. They’ve also added the ability to use Material Design.
What other interesting features are available? The Webix Development Center contains a couple of useful tools. For example, there’s a Skin Bulider that allows you to use and edit existing skins or create your own, and a Form Builder that allows you to create forms by defining the desired fields, layout, and automatically generate the code for your form. There’s even a Visual Designer that allows you create drag-and-drop applications and then get the generated code. It requires registration, so if you’re curious but lazy, here’s what it looks like:
The documentation page is full of information for developers of different levels. There are quick start guides, tutorials, demos, etc. If you can’t wait to start coding, you can use this code playground.
React. Fast and Module Oriented
Another framework that was built by the Internet giant, React is a creation of Facebook.
One of its most significant features is high performance that was achieved by using a virtual DOM instead of managing the browser’s actual DOM on the fly. A virtual DOM is not the actual rendered content but just data. That why it’s easier to determine changes.
Data flow. Usually, when you use MVC frameworks, you encounter a situation when views communicate with each other, which leads to difficulties keeping data in sync and makes your app more complex. React only supports data flowing downstream. The reason behind this approach is to create components that only listen to data coming from upstream rather than from each other.
React is a good choice if you plan to create reusable UI components. It is easy to pull out pieces of previously used code and redo it. Check the documentation page to learn how everything works.