宏觀認識
1.?What does Apple think of React Native ?
2.《如何評價 React Native？》：來自知乎的這個回答詳細介紹了 Facebook 即將開源的 React Native 的相關知識，包括核心實現、設計考慮、以及 React Native 的優勢和劣勢。
他們實現了一套類似css的子集，用來解決樣式問題，相當復雜和強大，靠這個才能將Native的核心組件組成JS層的基本組件再組成業務端的業務組件
2.5《First Impressions using React Native》：作者介紹了他使用 Facebook 即將開源的 React Native 的感受。
JavaScriptCore，using div and a you use things like View andText
3.《React.js Conf 2015 Keynote – Introducing React Native》：這是 Facebook 出品的 react.js 的視頻介紹。Facebook 打算用它來統一移動端的編程語言，react.js 把界面全部用 native 控件實現，js 只作為后端邏輯層。Facebook 也打算開源該框架，如果這個框架成功，將改變整個業界的移動開發效率，因為 iOS 和 android 代碼可以大部分復用。注：視頻來自 youtube。
came from扯了一堆，講了一堆 Native 不好的地方，迭代復雜，上手難。然后十多分才進入 RN，用的是Native的UI控件，底層用js調方法。
《React.js Conf 2015 Keynote 2 - A Deep Dive into React Native》
可以用chrome調試 構建iOS app的js代碼。
4. 《跨平臺開發時代的 (再次) 到來？》：這篇文章主要想談談最近又刮起的移動開發跨平臺之風，并著重介紹和對比一下像是 Xamarin，NativeScript 和 React Native 之類的東西。
5.?一種跨平臺的App開發解決方案??--? 設計上主要考慮的問題，對初學來說有點意思。
6. 也許，DOM 不是答案? --? Web App vs. Native App，為什么Web app有性能瓶頸？FlipBoard沒有使用DOM，用canvas輸出
源碼解析
布局
《react-native 之布局篇》：天貓前端@橫天同學對?css-layout?的布局能力做了一些實驗，給出了一些有價值的結論，如：react 寬度基于pt為單位；flex能實現網格系統需求，且網格能夠各種嵌套無bug；padding 設置在Text元素上所有padding變成了marginBottom...
JS/OC不會頻繁通信，會在事件觸發時批量傳遞，提高效率。
《React Native 通信機制詳解》：React Native 是 facebook 剛開源的框架，可以用 javascript 直接開發原生 APP，先不說這個框架后續是否能得到大眾認可，單從源碼來說，這個框架源碼里有非常多的設計思想和實現方式值得學習，本文介紹了它最基礎的 JavaScript-ObjectC 通信機制。
1. ?JS-OC通信實際上很簡單，OC向JS傳信息，webview的-stringByEvaluatingJavaScriptFromString?方法可以直接在當前context上執行一段JS腳本，并且可以獲取執行后的返回值，返回值就相當于JS向OC傳遞信息。
React Native也是以此為基礎，通過各種手段，實現了在OC定義一個模塊方法，JS可以直接調用這個模塊方法并還可以無縫銜接回調。
舉個例子，OC定義了一個模塊RCTSQLManager，里面有個方法-query:successCallback:，JS可以直接調用RCTSQLManager.query并通過回調獲取執行結果。
2. 底層實現：模塊配置表
入門
1.《React 入門實例教程》：React 起源于 Facebook 的內部項目，因為該公司對市場上所有 JavaScript MVC 框架，都不滿意，就決定自己寫一套，用來架設 Instagram 的網站。本文是阮一峰原創的入門教程。
ReactDOM.render()
JSX 語法 - JSX使得你在代碼當中編寫標記語言，HTML 與 JavaScript 的混寫
基本語法規則：遇到 HTML 標簽（以<開頭），就用 HTML 規則解析；遇到代碼塊（以{開頭），就用 JavaScript 規則解析。
React.createClass - 注意，組件類的第一個字母必須大寫，否則會報錯。組件類只能包含一個頂層標簽，否則也會報錯。
添加組件屬性，class屬性需要寫成className，for屬性需要寫成htmlFor，這是因為class和for是 JavaScript 的保留字。
React.Children.map來遍歷子節點，this.props.children表示組件的所有子節點，(1) undefined (2) object (3) array
組件類的PropTypes屬性，就是用來驗證組件實例的屬性是否符合要求
getDefaultProps方法可以用來設置組件屬性的默認值。
組件并不是真實的 DOM 節點，而是存在于內存之中的一種數據結構，叫做虛擬 DOM （virtual DOM）。只有當它插入文檔以后，才會變成真實的 DOM 。根據 React 的設計，所有的 DOM 變動，都先在虛擬 DOM 上發生，然后再將實際發生變動的部分，反映在真實 DOM上，這種算法叫做DOM diff，它可以極大提高網頁的性能表現。
真實的DOM節點 - ref屬性，由于 this.refs.[refName] 屬性獲取的是真實 DOM ，所以必須等到虛擬 DOM 插入文檔以后，才能使用這個屬性，否則會報錯。
this.state 狀態機，this.props表示那些一旦定義，就不再改變的特性，而this.state是會隨著用戶互動而產生變化的特性
<input type="text"? value={value}? onChange={this.handleChange} />，不能用props，要用事件回調 event.target.value 讀取用戶輸入。
組件的生命周期，- will & did
Mounting：已插入真實 DOM
Updating：正在被重新渲染
Unmounting：已移出真實 DOM
Ajax
{{}} ?== 這是因為React 組件樣式是一個對象，所以第一重大括號表示這是 JavaScript 語法，第二重大括號表示樣式對象。
2. HackerNews-React-Native：HackerNews-React-Native 是用 React Native 完成的 HackerNews 客戶端。
3. f8Conf-React-Native:?2016 官方F8 app 源碼
實時修復Bug，動態運營，動態增加功能
JSPatch用iOS內置的JavaScriptCore.framework作為JS引擎，但沒有用它JSExport的特性進行JS-OC函數互調，而是通過Objective-C Runtime，從JS傳遞要調用的類名函數名到Objective-C，再使用NSInvocation動態調用對應的OC方法。
JSPatch和wax一樣都是通過OC Runtime的接口通過字符串反射找到對應的類和方法進行調用，這中間的字符串處理會損耗一定的性能，另外兩種語言間的類型轉換也有性能損耗
所以動態添加業務模塊目前還是推薦嘗試React Native，但React Native并不會提供原生OC接口的反射調用和方法替換，無法做到修改原生代碼，JSPatch以小巧的引擎補足這個缺口，配合React Native用統一的JS語言讓一個原生APP時刻處于可擴展可修改的狀態。
方法調用 -- OC runtime ( 類名/方法名 -> 類和方法，替換實現，動態添加類+方法+注冊)
JSPatch 基本原理：JS 傳遞字符串給 OC，OC 通過 Runtime 接口調用和替換 OC 方法。
require
踩坑
nuclide + react + ES2015 + Redux
atom -> nuclide
react -- 27876 total
安裝：
- node是基于Chrome V8引擎的Javascript運行環境。
- watchman是 facebook 的一個開源項目，用來監視文件并且記錄文件的改動情況，當文件變更它可以觸發一些操作，例如執行一些命令等等。
- flow同樣是facebook的一個開源項目，是Javascript的靜態類型檢查器，用于發現JS程序中的類型錯誤，以提高程序員的效率和代碼質量。
<1>Node.js not linked error- 加權限 sudo chown -R $(whoami) /usr/local，再?brew link --overwrite node
<2>npm ERR! fetch failedhttp://registry.cnpmjs.org/react-native-cli/download/react-native-cli-1.0.0.tgz
這個坑最少找了幾十種方法：
npm config set registryhttps://registry.npm.taobao.org
npm config set disturlhttps://npm.taobao.org/dist
<3> react-native init? xxx 卡住不動? --React-Native init 失敗
降級 == sudo npm install -g npm@2.14.6
<4> could not connect to development server.
running npm startfrom react-native directory
Run npm starton local machine to start the development server. React Native relies on a development server to communicate with the app running in the simulator.
<5> 用 main.bundle 就是 Unable to execute JS call: __fbBatchedBridge is undefined.
用 url 就是 Could not connect to development server.
this page?has a good overview of?ES2015?features.
Props
State - You can also use a state container like?Redux?to control your data flow.
Style
height + width
Layout - flexDirection（行 和 列），alignItems（分布方式，頭，中，尾，around，between），justifyContent（第二坐標系，對應flexDirection，頭，中，尾，stretch(不需要w或者h)）
