使用React Native一年后的感受
转载自;http://www.dobest.me/blog/2016/06/12/%E4%BD%BF%E7%94%A8React%20Native%E4%B8%80%E5%B9%B4%E5%90%8E%E7%9A%84%E6%84%9F%E5%8F%97/
当我在面试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是这样说的:
可用性
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学习指南
总的来说,React Native很有潜力,它把我们团队的移动应用开发带上了一个新的台阶。像我这样原生的iOS开发者可以平滑地过渡到React Native,这有些出乎我的意料。同时,它也帮助我扩展职业技能,因为我也可以很轻松地向React编写的Web应用贡献代码了。
使用React Native一年后的感受的更多相关文章
- React Native初探
前言 很久之前就想研究React Native了,但是一直没有落地的机会,我一直认为一个技术要有落地的场景才有研究的意义,刚好最近迎来了新的APP,在可控的范围内,我们可以在上面做任何想做的事情. P ...
- React Native指南汇集了各类react-native学习资源、开源App和组件
来自:https://github.com/ele828/react-native-guide React Native指南汇集了各类react-native学习资源.开源App和组件 React-N ...
- React Native 常用学习链接地址
Android Studio下载http://www.android-studio.org/ 第二章:Android Studio概述(一)http://ask.android-studio.org/ ...
- React Native入门指南
转载自:http://www.jianshu.com/p/b88944250b25 前言 React Native 诞生于 2015 年,名副其实的富二代,主要使命是为父出征,与 Apple 和 Go ...
- 写给移动开发者的 React Native 指南
本文原创版权归 简书 wingjay 所有,如有转载,请于文章篇头位置显示标注原创作者及出处,以示尊重! 作者:wingjay 出处:http://www.jianshu.com/p/b8894425 ...
- windows 7下React Native环境配置
React Native 是 Facebook 推出的一个用 Java 语言就能同时编写 ios,android,以及后台的一项技术,它可以做到实时热更新 .FaceBook 也号称这们技术是 “Le ...
- React Native:使用 JavaScript 构建原生应用
[转载] 本篇为联合翻译,译者:寸志,范洪春,kmokidd,姜天意 数月前,Facebook 对外宣布了正在开发的 React Native 框架,这个框架允许你使用 JavaScript 开发原生 ...
- React Native Changed the World? or Nothing.
RN是一个awesome的技术, facebook很有想法的团队创造出一项新的技术改变了native开发界. 但是RN本身又疑点重重, RN是为了解决什么问题而存在的? 在诞生了一年后, RN又解决了 ...
- React Native开发技术周报2
(1).资讯 1.React Native 0.22_rc版本发布 添加了热自动重载功能 (2).技术文章 1.用 React Native 设计的第一个 iOS 应用 我们想为用户设计一款移动端的应 ...
随机推荐
- SOJ 1210 二叉树
1210. 二叉树 Constraints Time Limit: 1 secs, Memory Limit: 32 MB Description 在众多的数据结构中,二叉树是一种特殊而重要的结构,有 ...
- SSL读书笔记
摘要: 第一次写博客,为读书笔记,参考书目如下: <HTTP权威指南> <图解HTTP> <大型分布式网站架构设计与实践> 作者:陈康贤 一. HTTP+SSL=H ...
- golang的linux安装
1.wget https://storage.googleapis.com/golang/go1.6.2.linux-amd64.tar.gz tar -zxvf go1.6.2.linux-amd6 ...
- Lua手册中的string.len 不解
Lua手册中的string.len (s) 接收一个字符串,返回其长度. 空串 "" 的长度为 0 . 内嵌零也统计在内,因此 "a\000bc\000" 的长 ...
- erlang调试技术之etop
etop是erlang进程信息查看工具,类似于UNIX的top. 一.配置参数 node The measured node. Value: atom() Mandatory setcookie Co ...
- c#循环
循环:反复执行某段代码. 循环四要素:初始条件,循环条件,循环体,状态改变. for(初始条件;循环条件;状态改变) { 循环体 } break ——中断循环,跳出 ...
- asp 操作 json
<% Dim sc4Json Sub InitScriptControl Set sc4Json =Server.CreateObject("MSScriptControl.Scrip ...
- NSData与UIImage互相转换
1.//NSData转换为UIImage NSData *imageData = [NSData dataWithContentsOfFile: imagePath]; UIImage *image ...
- 浅谈h5移动端页面的适配问题
一.前言 昨天唠叨了哈没用的,今天说点有用的把.先说一下响应式布局吧,我一直认为响应式布局的分项目,一下布局简单得项目做响应式还是可以可以得.例如博客.后台管理系统等.但是有些会认为响应式很牛逼,尤其 ...
- YII 常用路径总结
Yii framework已经定义的命名空间常量 system: 指向Yii框架目录; YII\framework zii: 指向zii library 目录; YII\framework\zii ...