3 ms·
Yeah, adding Immutable.js will not magically give you a speed boost. Immutable.js gives you three primary benefits: - Its object API largely prevents accident
by acemarke 9y ago
Yeah, adding Immutable.js will not magically give you a speed boost.
Immutable.js gives you three primary benefits:
- Its object API largely prevents accidental mutations (although I think it's still possible to make mistakes if you use some of the updater callback methods)
- Internally, it uses specialized data structures that allow "structural sharing" of values. That means that creating a new object based on an existing one doesn't have to copy every single key/value pair onto the new object. This does show perf improvements for copying very large objects (thousands or tens of thousands of keys).
- React perf optimization generally relies on implementing `shouldComponentUpdate` to skip unneeded re-rendering. The standard approach to implementing `sCU` is a shallow equality check that relies on you having handled your data immutably so it can just compare references. React's built-in PureComponent class also implements that approach. As mentioned in other comments, you don't _have_ to use Immutable.js to handle data immutably, but it is one way to do it.
My links list does have links to several discussions of Immutable.js perf [0], and there's specifically one excellent article I've seen that does benchmarks of Immutable.js usage [1] [2]. I also wrote a Reddit comment a while back discussing the reasons why I generally advise against using Immutable.js [3].
As for your comments and questions about app architecture... based on your app description, I don't think Immutable.js would provide any particular speed benefit for you in terms of copying/updating objects. "Enforced immutability", though, _is_ key if you're using Redux, as it's a prerequisite for proper time travel debugging and correct React-Redux UI updates (per my blog post "The Tao of Redux, Part 1 - Implementation and Intent" [4]).
Other than that, my links list does have pointers to many articles about practical usage and lessons learned from real-world React and Redux applications [5] [6].
Your complaints are a bit on the general side, but as always, I'm happy to try to answer any specific questions you might have regarding React and Redux usage.
[0] https://github.com/markerikson/react-redux-links/blob/master/react-performance.md#immutable-data https://github.com/markerikson/react-redux-links/blob/master...
[1] https://medium.com/@dtinth/immutable-js-persistent-data-structures-and-structural-sharing-6d163fbd73d2 https://medium.com/@dtinth/immutable-js-persistent-data-stru...
[2] https://www.reddit.com/r/reactjs/comments/5h7pqz/persistent_data_structures_and_structural_sharing/ https://www.reddit.com/r/reactjs/comments/5h7pqz/persistent_...
[3] https://www.reddit.com/r/javascript/comments/4rcqpx/dan_abramov_redux_is_not_an_architecture_or/d51g4k4?context=3 https://www.reddit.com/r/javascript/comments/4rcqpx/dan_abra...
[4] http://blog.isquaredsoftware.com/2017/05/idiomatic-redux-tao-of-redux-part-1/ http://blog.isquaredsoftware.com/2017/05/idiomatic-redux-tao...
[5] https://github.com/markerikson/react-redux-links/blob/master/react-architecture.md https://github.com/markerikson/react-redux-links/blob/master...
[6] https://github.com/markerikson/react-redux-links/blob/master/redux-architecture.md https://github.com/markerikson/react-redux-links/blob/master...