Cloning ReactElements

Note: cloneWithProps is deprecated. Use React.cloneElement instead. In rare situations, you may want to create a copy of a React element with different props from those of the original element. One example is cloning the elements passed into this.props.children and rendering them with different props: var cloneWithProps = require('react-addons-clone-with-props'); var _makeBlue = function(element) { return cloneWithProps(element, {style: {color: 'blue'}}); }; var Blue = React.createClass({

Animation

React provides a ReactTransitionGroup add-on component as a low-level API for animation, and a ReactCSSTransitionGroup for easily implementing basic CSS animations and transitions. High-level API: ReactCSSTransitionGroup ReactCSSTransitionGroup is based on ReactTransitionGroup and is an easy way to perform CSS transitions and animations when a React component enters or leaves the DOM. It's inspired by the excellent ng-animate library. Getting Started ReactCSSTransitionGroup is the interface

Advanced Performance

One of the first questions people ask when considering React for a project is whether their application will be as fast and responsive as an equivalent non-React version. The idea of re-rendering an entire subtree of components in response to every state change makes people wonder whether this process negatively impacts performance. React uses several clever techniques to minimize the number of costly DOM operations required to update the UI. Avoiding reconciling the DOM React makes use of a

Add-ons

The React add-ons are a collection of useful utility modules for building React apps. These should be considered experimental and tend to change more often than the core. TransitionGroup and CSSTransitionGroup, for dealing with animations and transitions that are usually not simple to implement, such as before a component's removal. LinkedStateMixin, to simplify the coordination between user's form input data and the component's state. cloneWithProps, to make shallow copies of React componen