When using redux with immutable-js - do you call toJS () in your selector? Or are you using .get ('prop') in the render function?

Question

Now I use reselectto create my selectors to retrieve data from storage and pass it to propsthrough connect. For simplicity, the result of my selectors is always a JS object (call toJS()at the end of the selector), something like this:

const selector = state => state.get('data').toJS();

Now I'm trying to improve performance, and I realized that shouldComponentUpdatefuzzy comparisons lose the benefits of immutability due to the way I return from my selectors.

On the other hand, using .get('prop')inside my html seems extremely annoying:

<div>{this.props.data.get('prop')}</div>

Especially if I have a case of passing a simple JS object to a child component that is modified, for example:

<ChildComponent totalItems={10} />

And then there is no consistency in access to details (some of them are mutable, and some are immutable).

I was thinking of creating a helper unwrapfunction, something like this:

const unwrap = obj => obj && obj.toJS ? obj.toJS() : obj;

But I do not really like this solution. I do not like any of these approaches.

What do you use both for clean code and for performance?

Answer 1

Returning to my question in a year and a half with my own answer:

Always pass an immutable object, if possible. If it is not immutable, just pass it on as is.

, , , .

, toJS, . fromJS, redux.

, , - , .

Answer 2

, .

<MyComponent propsKey={Immutable.fromJS({someData: {key: "value"}})} />

Immutable, toJS(). , . "", Immutable.get(). , , . ( getIn() , ). , , , .props.propsKey .

Answer 3

, toJS() Immutable.js, .

Immutable.js, , , , .

Redux Immutable.js, .toJS(), "toJS" .