小談React、React Native、React Web

React有三個東西，React JS 前端Web框架，React Native 移動終端Hybrid框架，React Web是一個源碼轉換工具（React Native 轉 Web，並之因此特別提出，是以爲還有些用處）。 

React、React Native共同特色

起源

Facebook 的內部項目

理念

Learn once, write anywhere，而不是Write once, run anywhere。簡單說就是，讓你在Web、Mobile原生的開發套路同樣，但你仍是須要寫兩套代碼。Web Components的理解與實現。

開發工具

普通文本編輯器、Notepad++等便可

代碼寫法

支持ES6，組件化，看起來像NodeJS，全部代碼是寫在js裏的，不管是樣式仍是模板。

組件化

易複用：組件的複用變得很是容易，它們都是獨立的。

利解耦：使得組件的實現關注分離，利於解耦，更容易被理解和維護。

規範性：利用到ES6的模塊加載和導出，使得代碼簡單就能按規範的寫。也由於規範實現，使得Github上有的，就能夠拿來用。

可組合：一個組件易於和其它組件一塊兒使用，或者嵌套在另外一個組件內部。若是一個組件內部建立了另外一個組件，那麼說父組件擁有（own）它建立的子組件，經過這個特性，一個複雜的UI能夠拆分紅多個簡單的UI組件。

React

框架目的

基於組件化的開發，因此最終你的頁面應該是由若干個小組件組成的大組件。

瀏覽器兼容

IE8+

運行方式

通常須要先一層編譯，或者解析

PS：React JS我並無用過，不過寫法是React Native同樣。

React Native

框架目的

用js開發出效果接近原生的Android、iOS應用。緣由UI組件是原生實現緣由，效果是相近原生的。（作得像原生，那就得用原生作）

PS：目前Saas Link裏面的應用的效果在Android機器仍是不大好

開發環境

iOS、Android按照官方文檔搭建，大概1個小時。

開發調試

1. 可以在Chrome調試js，debug

2. 因爲組件由原生渲染，不能調試View

代碼風格

JSX 是一個看起來很像 XML 的 JavaScript 語法擴展。

組件生命週期

http://www.tuicool.com/articles/nu6zInB

提供植入原生應用

它很容易嵌入到一個並不是由React Native開發的應用當中。做爲應用的一部分。

React js的代碼能不能直接轉React Native?
ReactJs和React Native的原理是相同的，都是由js實現的虛擬dom來驅動界面view層渲染。

只不過ReactJs是驅動html dom渲染； React Native是驅動android/ios原生組件渲染。

真不能轉~

真不能Write once, run anywhere?
淘寶前端團隊(FED)把 React Native 的組件作了一個 Web 端的實現，並提供相關打包工具，讓你能夠直接打包出一份能夠跑在 Web 端的代碼。——React-Web

PS：http://www.jianshu.com/p/b5a91a503e6e

PS：我在本地嘗試過，沒跑起來，不過聽說是能夠的。

不過即使是可以轉換，須要面對幾個問題：

1. 這個轉換的工具可否及時跟上React Native發展。

PS：要是這個團隊不維護了或更新不及時（目前已經存在這種問題），這種依賴挺麻煩。

2. 存在轉換不了的React Native原生功能，這部分還須要作兼容。

3. 沒有完善的社區論壇，有問題解決不了。（目前只是在Github）

 

本文爲原創文章，轉載請保留原出處，方便溯源，若有錯誤地方，謝謝指正。

本文地址 ：http://www.cnblogs.com/lovesong/p/5679734.html