Back3 JavaScript Libraries to Keep an Eye on in 2015
Enjoy creating incredible things with JavaScript? You might like our course on how to Build Your First Meteor Application on our learning platform, Learnable.
As developers, we all know that our industry evolves at a very fast pace. So fast, indeed, that it’s often hard to keep up with all the new libraries, frameworks and new versions of the tools we use on a daily basis. Still, it’s important to stay as up to date as possible. Doing so ensures that we remain productive and in line with the expectations of our bosses and clients.
The new year started more than a month ago and some trends have already started to take shape. In this article, I’ll cover three libraries and frameworks worth keeping an eye on in 2015.
React.js
React.js, sometimes referred to as simply React, is a JavaScript library for creating user interfaces, and was created by a collaboration between Facebook and Instagram. Currently, it’s maintained by these two companies with the help of other developers, and it’s used by companies like Yahoo, Airbnb, Sony and (of course) Facebook and Instagram.
React.js isn’t a complete framework, so it doesn’t provide all the components you’ll find in other projects like Ember or AngularJS. It encourages the creation of reusable UI components, which present data that changes over time. Many people like to refer to React as the V in MVC. An important difference with frameworks like AngularJS – which uses a two-way data binding model – is that React features a one-way data binding model.
One of the most important concepts of this project is the virtual DOM. You can think of it as a set of elements that you can modify with your data and which, in the end, will modify the page’s real DOM. The virtual DOM is used for efficient re-rendering of the DOM by using a diff algorithm that only re-renders the components changed. This in turn enables the library to be ultra fast.
Another great feature is that it can also render on the server using Node.js. Therefore, you can use the same knowledge you’ve gained both on the client and on the server. This has major performance and SEO benefits. Many developers are using React.js to render a first, static version of the page on the server, which is faster than doing so on the client and is also SEO-friendly. Then they enable fast user interactions and UI updates by using React.js on the client side.
This is just a brief introduction to this library, and I really encourage you to learn more by visiting the React.js website. It contains a lot of useful tutorials that will help you in the learning process.
Meteor
Meteor is an open-source JavaScript framework written on top of Node.js, that focuses on real-time web applications. It’s not very new, as it has already reached a stable version (1.0), but lately I’ve been seeing more and more people discussing and adopting it to create their applications.
One of the main pros of Meteor is that it brings the famous Java motto of “Write once, run everywhere” into the JavaScript world. Using Meteor, you write code that runs both on the client and on the server, and you can even turn your web app into a mobile application by using Cordova behind the scenes. This kind of application is referred to as an isomorphic application – meaning an application that can run both client-side and server-side. The backend and frontend share the same code. If you love the fact that you can turn a Meteor application into a mobile app, you may want to read the article A Beginners Guide to Mobile Development with Meteor by David Turnbull.
When you install the framework, you get everything you need to develop both the client and server sides of your application, so it’s really fast to get up and running. Meteor comes with its own CLI that allows you to speed up your workflow. It also allows you to create a demo application on your local machine by typing the following command:
meteor create --example todos
One of my favorite features of this framework is that it’s reactive, meaning that any change to your data is automatically reflected everywhere throughout the app without the need for callbacks. Besides, as I mentioned before, Meteor focuses on real-time applications. So changes made by you or by other users are instantly reflected in the UI.
If this introduction seems appealing to you, I suggest to visit the official Meteor website, or read the articles 7 Reasons to Develop Your Next Web App with Meteor and What You Need To Know About Meteor 1.0, both published here on SitePoint.
Rendr
In recent months, I’ve been reading a lot about isomorphic applications, and Rendr is another library that employs this concept. It’s a small library developed by Airbnb that allows you to run Backbone.js applications on both the client and the server. The advantages are the same as mentioned in the React.js section: serving static and SEO-friendly HTML pages fast.
Being light-weight is one of the goals of this project. As mentioned in this article: In true Backbone style, Rendr strives to be a library as opposed to a framework.
Rendr also tries to be agnostic about the environment by minimizing code like if (server) {…} else {…}, which is what you’ll find in frameworks like Meteor.
Unfortunately, I’m not aware of real-world applications built using this framework (apart from the one mentioned in the linked Airbnb post), so I’m not sure it’s mature enough to be used in production.
Conclusion
In this article, I’ve described three very interesting projects that are attracting a lot of attention and that are joining the fascinating trend towards isomorphic applications.
In recent weeks I’ve been playing with React.js, and I must confess that I’m loving it. I’m still in the process of learning this library, so I don’t have strong opinions on it yet, and I need to use it in a major project to test it properly. But if it can serve the Instagram user base, I’m sure it can perform reliably in small to medium applications. I do find it funny that, while Google isn’t using its own AngularJS for applications like Gmail, Facebook is adopting React in production.
Have you ever used one or more of these libraries and frameworks? If so, what was your experience with them? And if you haven’t used them, are you willing to give them a try?