位置: 编程技术 - 正文
搞定immutable.js详细说明
编辑：rootadmin推荐整理分享搞定immutable.js详细说明，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:,内容如对您有帮助，希望把文章链接给更多的朋友！
什么是Immutable Data
Immutable Data是指一旦被创造后，就不可以被改变的数据。
通过使用Immutable Data，可以让我们更容易的去处理缓存、回退、数据变化检测等问题，简化我们的开发。
js中的Immutable Data在javascript中我们可以通过deep clone来模拟Immutable Data，就是每次对数据进行操作，新对数据进行deep clone出一个新数据。
deep clone
当然你或许意识到了，这样非常的慢。如下图，确实很慢
主角immutable.js登场immutable.js是由facebook开源的一个项目，主要是为了解决javascript Immutable Data的问题，通过参考hash maps tries 和 vector tries提供了一种更有效的方式。
简单的来讲，immutable.js通过structural sharing来解决的性能问题。我们先看一段视频，看看immutable.js是如何做的
当我们发生一个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，这就产生了浪费。这种情况其实很常见，可以参考flummox这篇文章
当然你可能会说，你可以使用PureRenderMixin来解决呀，PureRenderMixin是个好东西，我们可以用它来解决一部分的上述问题，但是如果你留心的话，你可以在文档中看到下面这段提示。
PureRenderMixin只是简单的浅比较，不使用于多层比较。那怎么办？？自己去做复杂比较的话，性能又会非常差。
方案就是使用immutable.js可以解决这个问题。因为每一次state更新只要有数据改变，那么PureRenderMixin可以立刻判断出数据改变，可以大大提升性能。这部分还可以参考官方文档Immutability Helpers
总结就是：使用PureRenderMixin + immutable.js
参考React.js Conf - Immutable Data and React
Immutability Helpers
PureRenderMixin
immutable-js
JS基于clipBoard.js插件实现剪切、复制、粘贴 摘要：最近做了一个项目，其中有这样一需求：实现一个点击按钮复制链接的功能，通过网上找相关资料，找到了几个插件，ZeroClipboard是通过flash实现
深入浅析Bootstrap列表组组件 Bootstrap，来自Twitter，是目前最受欢迎的前端框架。Bootstrap是基于HTML、CSS、JAVASCRIPT的，它简洁灵活，使得Web开发更加快捷。列表组是灵活又强大的组件,
原生JS封装Ajax插件(同域、jsonp跨域) 抛出一个问题，其实所谓的熟悉原生JS，怎样的程度才是熟悉呢？最近都在做原生JS熟悉的练习。。。用原生Js封装了一个Ajax插件，引入一般的项目，传
上一篇：Immutable 在 JavaScript 中的应用
