Skip to content

Commit 68cedb3

Browse files
authored
Deemphasize Immutable.js in docs (#2253)
1 parent 180cd22 commit 68cedb3

File tree

1 file changed

+1
-33
lines changed

1 file changed

+1
-33
lines changed

content/docs/optimizing-performance.md

Lines changed: 1 addition & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -381,36 +381,4 @@ function updateColorMap(colormap) {
381381

382382
If you're using Create React App, both `Object.assign` and the object spread syntax are available by default.
383383

384-
## Using Immutable Data Structures {#using-immutable-data-structures}
385-
386-
[Immutable.js](https://github.com/facebook/immutable-js) is another way to solve this problem. It provides immutable, persistent collections that work via structural sharing:
387-
388-
* *Immutable*: once created, a collection cannot be altered at another point in time.
389-
* *Persistent*: new collections can be created from a previous collection and a mutation such as set. The original collection is still valid after the new collection is created.
390-
* *Structural Sharing*: new collections are created using as much of the same structure as the original collection as possible, reducing copying to a minimum to improve performance.
391-
392-
Immutability makes tracking changes cheap. A change will always result in a new object so we only need to check if the reference to the object has changed. For example, in this regular JavaScript code:
393-
394-
```javascript
395-
const x = { foo: 'bar' };
396-
const y = x;
397-
y.foo = 'baz';
398-
x === y; // true
399-
```
400-
401-
Although `y` was edited, since it's a reference to the same object as `x`, this comparison returns `true`. You can write similar code with immutable.js:
402-
403-
```javascript
404-
const SomeRecord = Immutable.Record({ foo: null });
405-
const x = new SomeRecord({ foo: 'bar' });
406-
const y = x.set('foo', 'baz');
407-
const z = x.set('foo', 'bar');
408-
x === y; // false
409-
x === z; // true
410-
```
411-
412-
In this case, since a new reference is returned when mutating `x`, we can use a reference equality check `(x === y)` to verify that the new value stored in `y` is different than the original value stored in `x`.
413-
414-
Other libraries that can help use immutable data include [Immer](https://github.com/mweststrate/immer), [immutability-helper](https://github.com/kolodny/immutability-helper), and [seamless-immutable](https://github.com/rtfeldman/seamless-immutable).
415-
416-
Immutable data structures provide you with a cheap way to track changes on objects, which is all we need to implement `shouldComponentUpdate`. This can often provide you with a nice performance boost.
384+
When you deal with deeply nested objects, updating them in an immutable way can feel convoluted. If you run into this problem, check out [Immer](https://github.com/mweststrate/immer) or [immutability-helper](https://github.com/kolodny/immutability-helper). These libraries let you write highly readable code without losing the benefits of immutability.

0 commit comments

Comments
 (0)