谈谈 React Native

标签: react native | 发表时间:2015-02-01 16:27 | 作者:
出处:http://blog.devtang.com/

前言

几天前,Facebook 在 React.js Conf 2015 大会上推出了 React Native( 视频链接)。我发了一条微博( 地址),结果引来了 100 多次转发。为什么 React Native 会引来如此多的关注呢?我在这里谈谈我对 React Native 的理解。

一个新框架的出现总是为了解决现有的一些问题,那么对于现在的移动开发者来说,到底有哪些问题 React Native 能涉及呢?

人才稀缺的问题

首先的问题是:移动开发人才的稀缺。看看那些培训班出来的人吧,经过 3 个月的培训就可以拿到 8K 甚至上万的工作。在北京稍微有点工作经验的 iOS 开发,就要求 2 万一个月的工资。这说明当前移动互联网和创业的火热,已经让业界没有足够的开发人才了,所以大家都用涨工资来抢人才。而由于跨平台的框架(例如 PhoneGap,RubyMotion)都还是不太靠谱,所以对于稍微大一些的公司,都会选择针对 iOS 和 Android 平台分别做不同的定制开发。而 JavaScript 显然是一个群众基础更广的语言,这将使得相关人才更容易获得,同时由于后面提到的代码复用问题得到解决,也能节省一部分开发人员。

代码复用的问题

React Native 虽然强调自己不是 “Write once, run anywhere” 的框架,但是它至少能像 Google 的 j2objc 那样,在 Model 层实现复用。那些底层的、与界面无关的逻辑,相信 React Native 也可以实现复用。这样,虽然 UI 层的工作还是需要做 iOS 和 Android 两个平台,但如果抽象得好,Logic 和 Model 层的复用不但可以让代码复用,更可能实现底层的逻辑的单元测试。这样移动端的代码质量将更加可靠。

其实 React Native 宣传的 “Learning once, write anywhere” 本身也是一种复用的思想。大家厌烦了各种各样的编程语言,如果有一种语言真的能够统一移动开发领域,对于所有人都是好事。

UI 排版的问题

我自己一直不喜欢苹果新推出的 AutoLayout 那套解决方案,其实 HTML 和 CSS 在界面布局和呈现上深耕多年,Android 也是借鉴的 HTML 的那套方案,苹果完全可以也走这套方案的。但是苹果选择发明了一个 Constraint 的东西来实现排版。在企业的开发中,其实大家很少使用 Xib 的,而手写 Constraint 其实是非常痛苦的。所以出现了 Masonry 一类的开源框架来解决这类同行的痛苦。

我一直在寻找使用类似 HTML + CSS 的排版,但是使用原生控件渲染的框架。其实之前 BeeFramework 就做了这方面的事情。所以我还专门代表 InfoQ 对他进行过采访。BeeFramework 虽然开源多年,而且有 2000 多的 star 数,但是受限于它自身的影响力以及框架的复杂性,一直没有很大的成功。至少我不知道有什么大的公司采用。

这次 Facebook 的 React Native 做的事情相比 BeeFramework 更加激进。它不但采用了类似 HTML + CSS 的排版,还把语言也换成了 JavaScript,这下子改变可以称作巨大了。但是 Facebook 有它作为全球互联网企业的光环,相信会有不少开发者跟进采用 React Native。

不过也说回来,Facebook 开源的也不一定都好,比如 three20 就被 Facebook 放弃了,但是不可否认 three20 作为一个框架,在那个时期的特定价值。所以 React Native 即使没有成功,它也将人们关注的焦点放在了移动开发的效率上了。很可能会有越来越多相关的框架因此涌现出来。

MVVM

MVVM 在 Web 开发领域相当火热,而 iOS 领域的 ReactiveCocoa 虽然很火,但是还是非常小众。纠其原因,一方面是 ReactiveCocoa 带来的编程习惯上的改变实在太大,ReactiveCocoa 和 MVVM 的学习成本还是很高。另一方面是 ReactiveCocoa 在代码可读性、可维护性和协作上不太友好。

而 Web 开发领域对 MVVM 编程模式的接受程度就大不相同了,在 Web 开发中有相当多的被广泛使用的 MVVM 的框架,例如 AngularJS。相信 React Native 会推动 MVVM 应用在移动端的开发。

动态更新

终于说到最 “鸡冻人心” 的部分了。你受够了每次发新版本都要审核一个星期吗?苹果的审核团队在效率上的低下,使得我们这一群狠不得每天迭代更新一版的敏捷开发团队被迫每 2 周或 1 个月更新一次版本。很多团队上一个版本还没审核结束,下一个版本就做好了。

React Native 的语言是基于 JavaScript,这必然会使得代码可以从服务器端动态更新成为可能。到时候,每天更新不再是梦想。当然,代码的安全性将更一步受到挑战,如何有效保护核心代码的安全将是一个难题。

总结

不管怎么样,这确确实实是一个移动互联网的时代,我相信随着几年的发展,移动互联网的开发生态也会积累出越来越多宝贵的框架,以支撑出更加伟大的 App 出现。作为一个移动开发者,我很高兴能够成为这个时代的主角,用移动开发技术改变人们的生活。

愿大家珍惜这样的机会,玩得开心~

Posted by 唐巧 Feb 1st, 2015 iOS

原创文章,版权声明:自由转载-非商用-非衍生-保持署名 | Creative Commons BY-NC-ND 3.0

相关 [react native] 推荐:

谈谈 React Native

- - 唐巧的技术博客
几天前,Facebook 在 React.js Conf 2015 大会上推出了 React Native( 视频链接). 我发了一条微博( 地址),结果引来了 100 多次转发. 为什么 React Native 会引来如此多的关注呢. 我在这里谈谈我对 React Native 的理解. 一个新框架的出现总是为了解决现有的一些问题,那么对于现在的移动开发者来说,到底有哪些问题 React Native 能涉及呢.

React Native 原理与实践

- - 掘金 前端
React Native 介绍. 什么是 React Native. React Native 是一个由 Facebook 于 2015 年 9 月发布的一款开源的 JavaScript 框架,它可以让开发者使用 JavaScript 和 React 来开发跨平台的移动应用. 它既保留了 React 的开发效率,又同时拥有 Native 应用的良好体验,加上 Virtual DOM 跨平台的优势,实现了真正意义上的:.

React Native通信机制详解

- - bang's blog
React Native是facebook刚开源的框架,可以用javascript直接开发原生APP,先不说这个框架后续是否能得到大众认可,单从源码来说,这个框架源码里有非常多的设计思想和实现方式值得学习,本篇先来看看它最基础的JavaScript-ObjectC通信机制(以下简称JS/OC). 普通的JS-OC通信实际上很简单,OC向JS传信息有现成的接口,像webview提供的-stringByEvaluatingJavaScriptFromString方法可以直接在当前context上执行一段JS脚本,并且可以获取执行后的返回值,这个返回值就相当于JS向OC传递信息.

【WebRTC 跨端通信】React + React Native 双端视频聊天、屏幕共享

- - SegmentFault 最新的文章
之前介绍过 WebRTC,简单来说它是一个点对点的实时通讯技术,主要基于浏览器来实现音视频通信. 这项技术目前已经被广泛应用于实时视频通话,多人会议等场景. 不过 WebRTC 因为其过于优秀的表现,其应用范围已经不限于 Web 端,移动 App 也基本实现了 WebRTC 的 API. 在跨平台框架中,Flutter 和 React Native 都实现了对 WebRTC 的支持.

使用 BaaS 工具 与 React Native 构建原生应用

- - SegmentFault 最新的文章
React Native 是 Facebook 在今年的 F8 大会上发布的移动应用开发方案. 它基于JavaScript 和 React,可以让 Web 应用开发者在保持原有的开发体验和效率的同时,为 Web 应用带来原生应用的体验. React Native 使用 JavaScript 作为开发语言,其内建的打包系统支持包括 CommonJS 在内的多种模块化标准,因此很多支持浏览器运行环境的 Node Package 也可以运行在 React Native 中.

轻松配置react native热更新 - 简书

- -
react-native项目有个优势就是可以动态更新bundle.js,从而更新App. 框架包括客户端SDK,以及配套的服务端. code push服务,必须在服务端配置好. App Center CLI,用于服务端信息管理. 运行以上命令并在命令行确认后,网页会弹出一个要求登陆的页面,登陆后,会得到一串.

浅谈移动应用的跨平台开发工具(Xamarin和React Native)

- - 酷 壳 – CoolShell.cn
谈移动应用的跨平台开发不能不提HTML5,PhoneGap和Sencha等平台一直致力于使用HTML5技术来开发跨平台的移动应用,现在看来这个方向基本算是失败的,基于HTML5的移动应用在用户体验上与原生应用仍然存在着明显的差距. 与上述HTML5平台不同,Xamarin和React Native通过各自的方式来实现跨平台.

NervJS/taro: 开放式跨端跨框架解决方案,支持使用 React/Vue/Nerv 等框架来开发微信/京东/百度/支付宝/字节跳动/ QQ 小程序/H5/React Native 等应用。 https://taro.zone/

- -
👽Taro['tɑ:roʊ],泰罗·奥特曼,宇宙警备队总教官,实力最强的奥特曼. Taro是一个开放式跨端跨框架解决方案,支持使用 React/Vue/Nerv 等框架来开发微信/京东/百度/支付宝/字节跳动/ QQ 小程序/H5 等应用. 现如今市面上端的形态多种多样,Web、React Native、微信小程序等各种端大行其道,当业务要求同时在不同的端都要求有所表现的时候,针对不同的端去编写多套代码的成本显然非常高,这时候只编写一套代码就能够适配到多端的能力就显得极为需要.

Webpack 和 React 小书

- - SegmentFault 最新的文章
Webpack 和 React 小书. 这本小书的目的是引导你进入 React 和 Webpack 的世界. 他们两个都是非常有用的技术,如果同时使用他们,前端开发会更加有趣. 这本小书会提供所有相关的技能. 如果你只是对 React 感兴趣,那可以跳过 Webpack 相关的内容,反之亦然. 如果想学习更多的相关知识可以移步 SurviveJS - Webpack and React.

React入门实例学习

- - JavaScript - Web前端 - ITeye博客
        React可以在浏览器运行,也可以在服务器运行,但是在这为了尽量保持简单,且React语法是一致的,服务器的用法和浏览器差别不大,在这只涉及浏览器. 一. HTML模板.         使用React的网页源码,结构大致如下:.         1.最后一个script标签的type属性为text/jsx.