整理于互联网
# 一、前言
从问题说起：熟悉
React组件生命周期的话都知道：调用setState方法总是会触发render方法从而进行vdom re-render相关逻辑，哪怕实际上你没有更改到Component.state
this.state = {count: 0}
this.setState({count: 0});// 组件 state 并未被改变，但仍会触发 render 方法
@前端进阶之旅: 代码已经复制到剪贴板
- 为了避免这种性能上的浪费，
React提供了一个shouldComponentUpdate来控制触发vdom re-render逻辑的条件。于是PureRenderMixin作为一种优化技巧被使用。它仅仅是浅比较对象，深层次的数据结构根本不管用
js中的Immutable Data
在
javascript中我们可以通过deep clone来模拟Immutable Data，就是每次对数据进行操作，新对数据进行deep clone出一个新数据
- deep clone
- 当然你或许意识到了，这样非常的慢
'use strict';
var cloneDeep = require('lodash.clonedeep');
var data = {
id: 'data',
author: {
name: 'mdemo',
github: 'https://github.com/demohi'
}
};
var data1 = cloneDeep(data);
console.log('equal:', data1===data); //false
data1.id = 'data1';
data1.author.name = 'demohi';
console.log(data.id);// data
console.log(data1.id);// data1
console.log(data.author.name);//mdemo
console.log(data1.author.name);//demohi
@前端进阶之旅: 代码已经复制到剪贴板
这时候 immutableJS 就派得上用场了
var map1 = Immutable.fromJS({a:1, b:1, c:{b:{
