當我在面試 Discord 的時候,技術主管Stanislav跟我說: React Native 代表著未來。等它一發佈,我們就會用它從零構建iOS應用。 作為一名原生iOS開發者,基於先前使用PhoneGap的經驗,我非常懷疑使用Web技術構建移動應用的這種方式。但是當我學習並使用React Na ...
當我在面試 Discord 的時候,技術主管Stanislav跟我說:
React Native 代表著未來。等它一發佈,我們就會用它從零構建iOS應用。
作為一名原生iOS開發者,基於先前使用PhoneGap的經驗,我非常懷疑使用Web技術構建移動應用的這種方式。但是當我學習並使用React Native一段時間之後,我非常慶幸我們做了這個決定。
開發效率
雖然iOS“團隊”只有我自己一個人,但是iOS應用開發依然可以趕上Web和桌面應用開發閃電般的速度。Apple公司已經允許開發者使用 JavaScriptCore 進行應用的升級,而無需等待App Store的審核流程。這對於那些缺乏專業的iOS QA(質量保障)團隊的小公司來說是非常便利的,因為iOS團隊可以在發佈新功能之後進行熱更新。
使用React Native一年之後,我們的iOS開發周期明顯變快了,這得益於很高的開發效率。比如:
基於現有的前端架構,我們在兩周之內就發佈了V1.0的版本。
相比於 Auto Layout ,基於 Flexbox 的樣式可以節省一半的代碼,並且更容易理解。星密碼貨源
使用Flux設計模式,iOS和Web應用共用了 store 和 action 的98%的代碼。
性能
React Native在後臺線程運行JavaScript併發送極小的代碼到主線程中。事實證明,React Native相比於Objective-C或Swift編寫的原生iOS應用來說有一些性能差異!
Reactiflux小組的性能演示,該組有超過1.1萬個會員 —— UI和JS線程大多數都是60FPS
然而,我們當初開始構建iOS應用時發現 聊天滾動視圖 的性能並不令人滿意,尤其是一些活躍的聊天分組。於是,我們決定使用 ComponentKit 構建聊天視圖並編寫必要的橋接代碼代替原有的方案。當JS線程在完成一些繁重任務的時候,類庫也無法提供原生那樣流暢的動畫(譯註:之前動畫是在JS線程執行, 目前有人提交了一份代碼 ,有望使用原生iOS動畫介面),因此我們在抽屜側滑動畫上繼續使用 PopAnimation 。
註: 作者稱該應用僅聊天視圖和抽屜動畫是原生代碼實現的,其他均由React Native實現。
當React Native Android版本發佈時,我們也嘗試在Android設備上運行應用,但遺憾的是,我們遇到了一些性能問題,只好暫時放棄。Android開發主管Miguel是這樣說的:
很遺憾,不同Android設備的性能差異很大,這點明顯落後於iOS。我們可以讓應用運行地很快,但是性能——尤其是觸摸事件,即使在更高端設備上也不能令人滿意。並且在早期,由於React Native Android缺乏完善的功能,我們從產品原型過渡到成品應用比iOS花費了更多時間。
可用性
React Native讓開發工作更簡潔,使得開發者可以專註於每個新版本核心功能的開發。應用內自帶的開發者菜單為我節省了大量的時間。
其中我最喜歡的一個功能是 Show Inspector (審查工具),它可以即時展現交互視圖的層級結構以及被選組件中所有必要的樣式信息,這無疑是我用過的最棒的iOS審查工具。
社區
React Native項目每 兩周 會發佈一個新版本,其中包含一些新的特性以及修複的bug。這有利有弊,好比iOS幾個月的穩定版本的發佈,新的代碼需要額外的時間進行升級,尤其是生產環境中的應用。因此,這也是到目前為止我們fork的React Native倉庫只有四次主要升級的原因。
由於React Native還不太成熟,資源有限,也不完整。但隨著它越來越流行,在不久之後一定能趕上其他成熟的技術。下麵列出了一些實用的資源,我也經常在它的倉庫上提問和獲取最新的信息:
Reactiflux上的 #react-native 。
js.coach —React Native開源組件列表。
awesome-react-native —大量的React Native文章、教程和示例。
總的來說,React Native很有潛力,它把我們團隊的移動應用開髮帶上了一個新的臺階。像我這樣原生的iOS開發者可以平滑地過渡到React Native,這有些出乎我的意料。同時,它也幫助我擴展職業技能,因為我也可以很輕鬆地向React編寫的Web應用貢獻代碼了。