When to use .toJS() with Immutable.js and Flux?

Question

I\'m trying to use ImmutableJS with my React / Flux application.

My stores are Immutable.Map objects.

I\'m wondering at which point should I use

Answer 1

Ideally, never!

If your Flux stores are using Immutable.js then try to maintain all the way through. Use React.addons.ReactComponentWithPureRenderMixin to achieve a memoization performance win (it adds a shouldComponentUpdate methods).

When rendering, you may need to call toJS() as React v0.12.x only accepts Array as children:

render: function () {
  return (
    

      {this.props.myImmutable.map(function (item) {
        
{item.title}
      }).toJS()}
    
  );
}

This have changed in React v0.13.x. Components accept any Iterable as children instead of only Array. Since Immutable.js implements Iterable, you are able to omit the toJS():

render: function () {
  return (
    

      {this.props.myImmutable.map(function (item) {
        
{item.title}
      })}
    
  );
}