[b]什么是Immutable Data[/b] Immutable Data是指一旦被创造后，就不可以被改变的数据。 通过使用Immutable Data，可以让我们更容易的去处理缓存、回退、数据变化检测等问题，简化我们的开发。 [b]js中的Immutable Data[/b] 在javascript中我们可以通过deep clone来模拟Immutable Data，就是每次对数据进行操作，新对数据进行deep clone出一个新数据。 deep clone 当然你或许意识到了，这样非常的慢。如下图，确实很慢 [img]http://files.jb51.net/file_images/article/201605/deep-clone-slow.png[/img]

主角immutable.js登场

[url=https://github.com/facebook/immutable-js]immutable.js[/url]是由facebook开源的一个项目，主要是为了解决javascript Immutable Data的问题，通过参考[url=http://en.wikipedia.org/wiki/Hash_array_mapped_trie]hash maps tries[/url] 和 [url=http://hypirion.com/musings/understanding-persistent-vector-pt-1]vector tries[/url]提供了一种更有效的方式。 简单的来讲，immutable.js通过structural sharing来解决的性能问题。我们先看一段视频，看看immutable.js是如何做的 [img]http://files.jb51.net/file_images/article/201605/immutable-js-share.gif[/img] 当我们发生一个set操作的时候，immutable.js会只clone它的父级别以上的部分，其他保持不变，这样大家可以共享同样的部分，可以大大提高性能。

为什么你要在React.js中使用Immutable Data

熟悉React.js的都应该知道，React.js是一个UI = f(states)的框架，为了解决更新的问题，React.js使用了virtual dom，virtual dom通过diff修改dom，来实现高效的dom更新。 听起来很完美吧，但是有一个问题。当state更新时，如果数据没变，你也会去做virtual dom的diff，这就产生了浪费。这种情况其实很常见，可以参考[url=http://acdlite.github.io/flummox/docs/guides/why-flux-component-is-better-than-flux-mixin]flummox这篇文章[/url] 当然你可能会说，你可以使用[url=http://facebook.github.io/react/docs/pure-render-mixin.html]PureRenderMixin[/url]来解决呀，PureRenderMixin是个好东西，我们可以用它来解决一部分的上述问题，但是如果你留心的话，你可以在文档中看到下面这段提示。