The latest version of React, Facebook’s open source JavaScript library, has been made available.

React is a JavaScript library for building user interfaces by Facebook and Instagram. While it started life at Facebook, it was declared open source in May 2013. It's declarative and designed to be efficient, extremely flexible, and to work with the libraries and frameworks that you already know. The new release, React 0.11, supports JSX Namespacing, handles getDefaultProps better, and can render nulls.

The developers built React to solve the problem of building large applications with data that changes over time. It deals with this by letting you specify how your app should look at any given point in time, leaving React to automatically manage all UI updates when your underlying data changes.

According to the React website,

“when the data changes, React conceptually hits the "refresh" button, and knows to only update the changed parts.”

Essentially, you build reusable components that implement a render() method that takes input data and returns what to display.

The developers admit that when React was open-sourced, the initial reception was skeptical, and received mostly disapproving first-impressions. While they says it's been hard to convince people to try React, those who have tried it have been impressed, and that the technology really shines when used with data that changes over time.

The changes to the latest version start with a change to the way getDefaultProps() is handled. It is now called only once when React.createClass() is called, instead of each time a component is rendered, so improving performance.

The ability to render to null has also been added. In a blog post about the new release, Paul O’Shannessy of the React developer team says:

“since React's release, people have been using work arounds to "render nothing". Usually this means returning an empty <div/> or <span/>. Some people even got clever and started returning <noscript/> to avoid extraneous DOM nodes. We finally provided a "blessed" solution that allows developers to write meaningful code. Returning null is an explicit indication to React that you do not want anything rendered. Behind the scenes we make this work with a <noscript> element, though in the future we hope to not put anything in the document. In the mean time, <noscript> elements do not affect layout in any way, so you can feel safe using null today!”

JSX Namespacing has also been added. The developers have used a standard JS approach: object property access. Instead of assigning variables to access components stored in an object (such as a component library), you can now use the component directly as <Namespace.Component/>.

Given the many JavaScript libraries that are already established, it’s still not clear whether React will gain enough ground to become a major player, but as the developers point out, while some of the ideas behind React may seem crazy at first glance, they have worked for building thousands of components both inside and outside of Facebook and Instagram.

Comments

Make a Comment or View Existing Comments Using Disqus

or email your comment to: comments@i-programmer.info