RN千機變
1.技術體系問題css
RN和React共用一套抽象層，相對於前端，RN其實更接近Node的運行環境html
ReactNative =React +IOS +Android
看RN文檔時，我會發現入門基礎那一塊介紹的都是React的內容，進階篇則介紹了不少IOS和Android的API前端
2.組件設計問題react
Android和IOS一些設計組件是不共通的，這意味着，本來在React上只返回一個組件的狀況下，RN中你可能須要判斷平臺分別返回兩個版本的組件，爲何要這樣？ 由於對於許多組件，兩個平臺的風格差別實在太大，只能分而治之。android
3.靜態資源問題ios
RN應用和普通Web應用有一些天生的差異，RN應用是能夠植入預約的靜態資源的，也就是不須要通過任何一次請求，而均可以本地使用的靜態資源，而Web應用試圖使用這種資源則須要通過至少一次的網絡請求而且緩存，但仍有可能被用戶強清緩存等操做付之一炬。web
這意味着，作性能優化時也許能夠從靜態資源入手了，我閱讀了如下文章後 探索 react native 首屏渲染最佳實踐數據庫
學習到了能夠經過靜態文件佔位圖優化RN首屏的新思路。固然，不少時候React和RN的優化思路也是共通的，例如react-native
- 資源預先緩存
- 長列表延遲加載等等
4.標籤生效問題瀏覽器
- <div>不能用啦，要用<view>
- <p>標籤用不了啦,要用<Text>
- 沒有<img>了，取而代之的是<Image>
- 背景，能夠用ImageBackground這個組件
- 列表，不能用ul/li啦，用ListView組件吧兄弟
- 各類Input，不能用input標籤啦～ 要用對應的原生控件，好比TextInput、Picker、Switch、Slider
5.事件核心問題
Web開發中，點擊事件是核心，而在主攻移動端的RN中，觸摸事件的地位則大大加強，並且除此以外，還衍生了長按事件（JS中我記得只有雙擊事件沒有長按事件）
- onPressOut等等
- onLongPress 等等
6.CSS3屬性受限，動畫效果使用方式徹底變動
CSS/Animation我用不了了，由於CSS已經沒了了，底層是用bridge調原生的UI構建
7.虛擬DOM到虛擬View的演變
在React中，咱們使用虛擬DOM模擬現實中的DOM節點
在RN中，這個對象被換成了虛擬View,對應原平生臺中的視圖，由於RN中已經沒有DOM了
8.UI呈現的變化
（如下參考自： http://blog.ilibrary.me/2016/12/25/react-native-internal）
UI的描述和呈現分離開了。
- html文本描述了頁面應該有哪些功能，css告訴瀏覽器該長什麼樣。
- 瀏覽器引擎經過解析html和css，翻譯成一些列的預約義UI控件，
- 而後UI控件去調用操做系統繪圖指令去繪製圖像展示給用戶。
- Javascript無關緊要，主要用於html裏面一些用戶事件響應，DOM操做、異步網絡請求和一些簡單的計算。
在react native 裏面，1和2是不變的，也是用html語言描述頁面有哪些功能，而後stylesheet告訴瀏覽器引擎每一個控件應該長什麼樣。而且和瀏覽器用的是同一個引擎。
在步驟3裏面UI控件再也不是瀏覽器內置的控件，而是react native本身實現的一套UI控件（兩套，android一套，ios一套），這個切換是在MessageQueque中進行的，而且還能夠發現，他們tag也是不同的。參考連接：http://blog.ilibrary.me/2016/12/25/react-native-internal
RN大觀園
- IOS9只支持https，以http加載網絡圖片資源是無效的
- React-native內置babel轉換器和ES6的polypill
- RN使用的引擎是safari的引擎而咱們通常調試的時候用的是Chrome的V8引擎
- 遇到頻繁修改屬性的場景，爲了不影響性能，建議使用setNativeProp直接修改屬性，而不是走setState的流程
- 測試元素和包裹容器的距離，在普通場景中咱們可能會考慮scrolltop，offsetTop等一堆屬性，在RN中能夠經過一個方法，叫measure和measureLayOut，能分別測以某個元素爲參考點的相對位置和絕對位置
- RN相對於普通web應用，增長了一個屬性叫hsl，能夠指定：色度-飽和度-亮度，是否是感受和rgba很相似的做用呀
- 若是訪問的一些API，可是RN平臺暫時沒有作封裝，就須要本身用Object-C或者Android實現
- 數據庫： RN是移動端應用，那不就意味着能夠用Android等的數據庫或者文件系統了嗎？ 在RN中這彷佛被封裝成了AsyncStroage,若是以爲API還不能知足的話，能夠用社區裏的一個高性能的RN庫——realm
- 後臺任務能夠很方便的用了，就像web-worker同樣
- 編寫跨平臺代碼時候，RN專門提供了Platform對
- Plaform.OS: 返回平臺名稱，好比iOS或者android
- Plaform.Version: 返回版本
- Plaform.select: 方法，接收一個對象，能夠分別指定ios和android環境下的返回值，酌情返回
12.導航有提供專門的模塊：好比react-navigation和react-native-navigation
13.動畫要用Animated控件，不能本身寫CSS3的動畫屬性了，好比Animation和transition
原文出處：https://www.cnblogs.com/penghuwan/p/11515692.html