JS -- Immutable.js & React & Redux

亂入的Docker

Docker是一個開源工具，能將一個WEB應用封裝在一個輕量級，便攜且獨立的容器裏，然後可以運行在幾乎任何服務環境下。

Docker的容器能使應用跑在任何服務器上並且表現一致。一個開發者在筆記本上建立的一個容器，能跑在很多環境下，如：測試環境，生產環境，虛擬機上，VPS，OpenStack集羣，公用的電腦等等。

Docker的一般使用在以下幾點：
1 自動化打包和部署應用
2 創造一個輕量級的，私人的 PAAS 環境
3 自動化測試和連續的 整合/部署
4 部署WEB應用，數據庫和後端服務

下面開始正題

JS中的對象，由於使用了引用賦值，新的對象只是簡單的指向了原始對象，所以兩個對象的操作會互相影響。

foo={a: 1}; 
bar=foo; 
bar.a=2

這時，foo bar的a都變成了2。當應用複雜的時候，這樣的操作會存在很大的隱患。爲了解決這個問題，我們引入Immutable。

Immutable對象的最大特點就是，一旦被創建，就不能再被修改。任何試圖對Immutable對象的修改操作都會返回一個新的Immutable對象，而原對象不會改變。

Immutable 實現的原理是 Persistent Data Structure（持久化數據結構），也就是使用舊數據創建新數據時，要保證舊數據同時可用且不變。同時爲了避免 deepCopy 把所有節點都複製一遍帶來的性能損耗，Immutable 使用了 Structural Sharing（結構共享），即如果對象樹中一個節點發生變化，只修改這個節點和受它影響的父節點，其它節點則進行共享。

原理動畫：
http://img.alicdn.com/tps/i2/TB1zzi_KXXXXXctXFXXbrb8OVXX-613-575.gif
原文鏈接：
https://zhuanlan.zhihu.com/purerender/20295971

immutable.js

immutable.js 是流行的 Immutable 庫。其中，最重要的三種數據結構是：

Map：鍵值對集合，對應於 Object，ES6 也有專門的 Map 對象
List：有序可重複的列表，對應於 Array
Set：無序且不可重複的列表

代碼示例：

// immutable.js
import Immutable from 'immutable';
foo = Immutable.fromJS({a: {b: 1}}); // fromJS方法
bar = foo.setIn(['a', 'b'], 2);   // 使用 setIn 賦值
console.log(foo.getIn(['a', 'b']));  // 使用 getIn 取值，打印 1
console.log(foo === bar);  //  打印 false

let map1 = Immutable.Map({a:1, b:1, c:1});
let map2 = Immutable.Map({a:1, b:1, c:1});
map1 === map2;             // false
Immutable.is(map1, map2);  // true

實踐

1、與React搭配，在shouldComponentUpdate返回false來避免不必要的渲染。

2、與Redux搭配，設置Store。