花了两个个半月的时间，将电商 android/ios app开发完毕，并上线。现在先稍微总结下react-native的使用经验。
####请不要选择React-native
1.如果你想用它来开发android，并且对UI有要求，尤其是图片。请不要用它，在图片加载之前，必须设定好渲染大小(现在ios好像出了第三方插件，来解决这个问题)。
2.如果你们团队对ES6,ES7没听说过，甚至不知道Promise是啥，请不要用它。因为它需要大量的学习。
3.如果你的团队对原生android,ios一点也不了解的话，请不要用它，因为它的第三方库并不完善，很多时候需要自己写原生，然后桥接到js上。
4.在现在的android版本中，cordova或许是更好的选择，现在没有找到任何一项权威的benchmark说明它比cordova运行更流畅，更爽。
####请使用react-native
1.如果你优先考虑ios，请用它，一些shadow，边框，删除线等常用特效实现起来仅需要几行css样式。
2.用它写会比原生更简单，更快速。
3.可完全复用逻辑层，dom，css甚至也能复用。
4.js编写逻辑和页面UI，也就是有绕开App store直接升级的可能（这是诱惑最大的地方，但需要自家开发）
####react-native资料搜罗
它的资料除了官网，真的很少，很多特性需要去摸索，更多的可参看第三方插件源码来获得。
先说下IDE:
idea社区版（android开发）,xcode(Ios开发)，WebStorm(Js开发，记得开flow兼容)。至于Atom，各种卡，已经放弃掉。
上面三款IDE比较爽的一套组合,和sublime相比，极大提高效率。
至于文档，这里只推荐(官网)[http://facebook.github.io/react-native] ，而中文版本，有一点老，入门的话还是可以看点的。官网上的getting-started.html对于各个环境讲解很详细了，照着做即可，但记住要挂VPN，有些java库是需要翻墙下载的。另外，个人建议用git submodule来管理react-native依赖，毕竟它还不完善，时常需要你去动手改改源码、合并最新的一些特性分支。
接下来稍微说下react-native用到的知识点，方便读者对react-native所用到的各项技术有个大体把握。
#####Android
Android SDK提供最基本的java API,Android NDK则相当于一个桥，使你写的C\C++也能跑在Android机子上。
gradle，使用groovy语言写的java库依赖和项目管理工具，类似于ios的cocopods、js的npm+grunt/glup，这个你不需要太过深究。gradle官网
genymotion模拟器，极大提升android开发效率，完爆android SDK自带模拟器，最重要的是个人使用免费，仅需要注册。
####Javascript
react,react-native技术始源，我们所写的app结构都是基于该框架下的，各种概念都有，所以需要详细研读官网
Babel,这相当于是一个转换器。将你写的基于ES6/ES7标准的js代码转换成ES5，关于各个js特性的支持，是需要进行配置的，react-native 本身已默认用了一些，参看这里.Babel官网
flow,静态类型检测器。作用是给js加上类型系统，在编译过程中，会进行类型检查，然后报错。本人只将它当成一个类型标记工具，给每个参数都标上类型，使代码易读。如果你想用得更深，让它一点不报错，所做的付出太多,不太建议个人投入精力。如果你们是以团队形式进行编程的话，则最好能让它不报错。官网,该网站已墙，注意翻墙。
flux，一个现阶段横扫我大脑的前端开发模式。刚开始写项目的时候，还觉得用它会写很多多余代码，但当购物车模块重构两次，用它一会就搞定之后，整个app的逻辑模块都按照flux模式重写了一遍。官网
immutable.js,不可变数据集合库。这个库个人用得不爽，直接使用Array。但这里不得不提一下，如果团队成员关于可变与不可变区分的不是很清楚的话，建议引入它以减少Bug。官网
####Ios
cocopods,项目依赖管理工具。和gradle一样，没啥值得讲，一个团队中只要有一个人刷一下，分享几分钟，就结束了。
####react-native常见问题
#####navigator和NavigationContext
熟悉Ios开发的同学一定不会陌生navigator，甚至react-native navigator的api和效果都是仿照Ios而来的。 在不少场景中，我们的app会有多个navigator，但最好将他们统一管理到全局对象中去，你会因此节约大量的代码并能实现在各种页面中随意跳转。NavigationContext.addEventListener() API需要注意一下，它可以帮助你在navigator初始化时，捕获关于它的引用，然后扔到全局对象中去。另外navigationContextTest.js测试文件可以帮助你快速熟悉它的其它特性。
#####react-native布局
Flex布局教程 这一篇文章，对于了解UI布局有不少的帮助。但css3的Flexbox和react-native上的flex，有不少出入。需要自己去做一些demo，体验一下。现在的react-native关于UI部分的代码基本稳定，bug基本上解决的差不多了。除了图片必须要先设置大小这么一个问题。
#####android和Ios是两个UI应用
如果条件允许的的话，不要统一android和Ios的页面效果，他们都有各自本身的风格，用好各自特有的原生UI组件，会有更好的性能表现。如果都用Js去写的话，iphone4s会有一点卡顿现象，另外页面跳转的方式，最好使用Android的页面跳转方式，体验会好一些。
#####快速跟进react-native项目进度
react-native关于android的组件还在高速的实现中，Ios的性能优化也在不断进行，甚至整个项目的构造，也在不断演进中，在我使用的过程中，至少经历了三次大动作（必须经过比较大的改动，项目才能使用最新的版本）。另外以现在项目的演进形式，并不能保证你的App可以无损地跟进react-native,每一次版本迭代，你最好都要从头到位的测一测，然后将一些FixBug实现重写下，看看当前版本是否不需要Fix了，甚至有一些有可能发生上一个版本好好的，最新版本反而出现问题了的情况。
#####请使用Flux设计模式
刚开始时，只用了一个自己做的事件发布订阅队列来处理数据UI同步。但随着事件的越来越多，各种事件满天飞，带来了极严重的bug定位和代码书写混乱问题。在使用Flux后，可批量雷同写代码，几乎去除掉了个人代码风格，很容易看懂，逻辑上的Bug减少了一大部分。
#####flow,typescript和scalajs
flow是facebook出品，官方支持，typescript官方没有计划支持，貌似社区进行支持了，但不知可用否，也不建议大家用typescript进行折腾。至于scalajs，如果我还有下一个react-native项目，尽量尝试用它来写，毕竟还能能减少不少代码呢。
#####Promise
在开发的时候，请hack掉原生Promise，实现一个默认的catch方法，用来处理异常。因为经常会由于遗漏处理Promise异常，而导致小bug不能一下定位出来。
#####Adapter适配器。
在写css样式和使用各自平台不同API的时候，经常遇到android ios各一套的情况。我会这样解决，供大家参考（貌似和官方的有些出入）:
1.生成indexStyle.js,indexStyleAdapter.android.js,indexStyleAdapter.ios.js三个文件。
2.在indexStyle.js中 import adapter from "indexStyleAdapter"
3.在*Adapter中写各自的样式和调用各自平台的API，然后在IndexStyle中，将实现引入进来。
###总结
在技术选型时，因为当时只有一个web前端和刚学了半个月Ios的后台(我)，为了快速完成任务，采用了它。然而在实际使用中，前端觉得此项技术太难，辞职。也就只剩下一个我孤军奋战前后端。所以说，不要认为Js简单就轻视掉react-native，它的学习成本并不低。我跟着react-native从0.11走到0.19，见证了它急速地进步，各项功能组件不断丰富。现在常用的基本上都有了，尤其是Ios，如果UI细节真不是要求贼高的话（IOS border弧度有些粗糙，border线的粗细并不一样o(╯□╰)o。），react-native完全能胜任。至于android,低端机子基本放弃（全js绘图，在小米2s上有卡顿现象，但还是能用），而高端机子会因为图片而内存溢出（此项bug在我的App引起的闪退概率为2%-4%）。只能说未来一片光明啊，而现在还属于挣扎中！另外我还发现了一个有趣的现象，上面所列的facebook js库,它们在github上获得的star，均超过1w了，说facebook是现在技术最先进的公司也不是没有道理的。
658
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
