在 React Native 推出后不久，我们开始每两周发布一次版本，以帮助社区采用新功能，同时保持版本稳定以供生产使用。在 Facebook，我们必须每两周稳定一次代码库，以便发布我们的生产 iOS 应用，因此我们决定以相同的速度发布开源版本。现在，许多 Facebook 应用每周发布一次，尤其是在 Android 上。由于我们每周从主分支发布，我们需要保持其相当稳定。因此，每两周发布一次的节奏甚至不再使内部贡献者受益。

我们经常听到社区的反馈，即发布速度难以跟上。Expo 等工具不得不跳过每个其他版本，以便管理版本中的快速变化。因此，很明显，每两周发布一次的版本并没有很好地为社区服务。

现在每月发布​

我们很高兴宣布新的每月发布节奏，以及 2016 年 12 月的发布版本 v0.40，该版本在上个月一直在稳定，并且可以采用。（只需确保更新 iOS 上原生模块中的标头）。

尽管可能会因避免周末或处理意外问题而有所延迟几天，但您现在可以预期给定版本将在每月的第一天可用，并在月底发布。

使用当前月份的版本以获得最佳支持​

一月份的候选版本已准备好试用，您可以在此处查看新功能。

为了查看即将到来的更改并为 React Native 贡献者提供更好的反馈，请尽可能始终使用当前月份的候选版本。到每个版本在月底发布时，它包含的更改已经在 Facebook 生产应用中发布了两个多星期。

您可以使用新的 react-native-git-upgrade 命令轻松升级您的应用

npm install -g react-native-git-upgrade
react-native-git-upgrade 0.41.0-rc.0

我们希望这种更简单的方法将使社区更容易跟踪 React Native 中的更改，并尽快采用新版本！

（感谢 Martin Konicek 提出此计划，并感谢 Mike Grabowski 使其实现）

升级到新版本的 React Native 一直很困难。您可能以前见过类似这样的情况

这些选项都不是理想的。通过覆盖文件，我们会丢失本地更改。通过不覆盖，我们无法获得最新的更新。

今天，我很荣幸推出一个新工具，可以帮助解决这个问题。该工具名为 react-native-git-upgrade，并在幕后使用 Git 来尽可能自动解决冲突。

用法​

要求：Git 必须在 PATH 中可用。您的项目不必由 Git 管理。

全局安装 react-native-git-upgrade

$ npm install -g react-native-git-upgrade

或者，使用 Yarn

$ yarn global add react-native-git-upgrade

然后，在您的项目目录中运行它

$ cd MyProject
$ react-native-git-upgrade 0.38.0

注意：不要运行 'npm install' 来安装新版本的 react-native。该工具需要能够比较旧的和新的项目模板才能正确工作。只需在您的应用文件夹中运行它，如上所示，同时仍停留在旧版本上。

示例输出

您也可以在不带参数的情况下运行 react-native-git-upgrade 以升级到最新版本的 React Native。

我们尝试保留您在 Android 和 iOS 构建文件中的更改，因此您无需在升级后运行 react-native link。

我们已将实现设计为尽可能少的侵入性。它完全基于在临时目录中即时创建的本地 Git 仓库。它不会干扰您的项目仓库（无论您使用何种 VCS：Git、SVN、Mercurial，... 或无）。如果发生意外错误，您的源代码将被恢复。

它是如何工作的？​

关键步骤是生成 Git 补丁。该补丁包含 React Native 模板中在您的应用使用的版本和新版本之间所做的所有更改。

为了获得此补丁，我们需要从 node_modules 目录中 react-native 包中嵌入的模板生成一个应用（这些是 react-native init 命令使用的相同模板）。然后，在从当前版本和新版本中的模板生成原生应用后，Git 能够生成一个适用于您的项目的补丁（即包含您的应用名称）

[...]

diff --git a/ios/MyAwesomeApp/Info.plist b/ios/MyAwesomeApp/Info.plist
index e98ebb0..2fb6a11 100644
--- a/ios/MyAwesomeApp/Info.plist
+++ b/ios/MyAwesomeApp/Info.plist
@@ -45,7 +45,7 @@
        <dict>
            <key>localhost</key>
            <dict>
-               <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
+               <key>NSExceptionAllowsInsecureHTTPLoads</key>
                <true/>
            </dict>
        </dict>
[...]

我们现在需要做的就是将此补丁应用于您的源文件。虽然旧的 react-native upgrade 过程会提示您注意任何小的差异，但 Git 能够使用其 3 向合并算法自动合并大多数更改，并最终为我们留下熟悉的冲突分隔符

    13B07F951A680F5B00A75B9A /* Release */ = {
      isa = XCBuildConfiguration;
      buildSettings = {
        ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
<<<<<<< ours
        CODE_SIGN_IDENTITY = "iPhone Developer";
        FRAMEWORK_SEARCH_PATHS = (
          "$(inherited)",
          "$(PROJECT_DIR)/HockeySDK.embeddedframework",
          "$(PROJECT_DIR)/HockeySDK-iOS/HockeySDK.embeddedframework",
        );
=======
        CURRENT_PROJECT_VERSION = 1;
>>>>>>> theirs
        HEADER_SEARCH_PATHS = (
          "$(inherited)",
          /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/include,
          "$(SRCROOT)/../node_modules/react-native/React/**",
          "$(SRCROOT)/../node_modules/react-native-code-push/ios/CodePush/**",
        );

这些冲突通常很容易理解。分隔符 ours 代表“您的团队”，而 theirs 可以被视为“React Native 团队”。

为什么引入一个新的全局包？​

React Native 附带一个全局 CLI（react-native-cli 包），它将命令委托给嵌入在 node_modules/react-native/local-cli 目录中的本地 CLI。

正如我们在上面提到的，该过程必须从您当前的 React Native 版本开始。如果我们将实现嵌入在 local-cli 中，那么当您使用旧版本的 React Native 时，您将无法享受此功能。例如，如果此新的升级代码仅在 0.38.0 中发布，您将无法从 0.29.2 升级到 0.38.0。

基于 Git 的升级是开发人员体验的重大改进，并且使其对每个人都可用非常重要。通过使用单独的包 react-native-git-upgrade 全局安装，您可以立即使用此新代码，无论您的项目使用什么版本的 React Native。

另一个原因是 Martin Konicek 最近的 Yeoman wipeout。我们不想将这些 Yeoman 依赖项重新放回 react-native 包中，以便能够评估旧模板以创建补丁。

试用并提供反馈​

最后，我想说，享受此功能，并随时提出改进建议、报告问题，尤其是发送拉取请求。每个环境都有些不同，每个 React Native 项目也各不相同，我们需要您的反馈才能使其对每个人都有效。

谢谢！​

我要感谢伟大的公司 Zenika 和 M6 Web (已存档)，没有他们，这一切都不可能实现！

我们从很多人那里听说，React Native 正在进行大量工作，很难跟踪正在发生的事情。为了帮助沟通正在进行的工作，我们现在发布了 React Native 的路线图。在高层次上，这项工作可以分为三个优先事项

• 核心库。为最有用的组件和 API 添加更多功能。
• 稳定性。改进底层基础设施以减少错误并提高代码质量。
• 开发者体验。帮助 React Native 开发人员更快地行动

如果您对您认为在路线图上很有价值的功能有建议，请查看 Canny，您可以在其中建议新功能并讨论现有提案。

React Native 的新功能​

今天发布的 React Native 0.37 版本 引入了一个新的核心组件，可以非常轻松地向任何应用添加可触摸的 Button。我们还引入了对新的 Yarn 包管理器的支持，这应该可以加快更新应用依赖项的整个过程。

介绍 Button​

今天，我们推出一个基本的 <Button /> 组件，它在每个平台上看起来都很棒。这解决了我们收到的最常见的反馈之一：React Native 是唯一没有开箱即用的按钮的移动开发工具包之一。

<Button
  onPress={onPressMe}
  title="Press Me"
  accessibilityLabel="Learn more about this Simple Button"
/>

经验丰富的 React Native 开发人员知道如何制作按钮：在 iOS 上使用 TouchableOpacity 以获得默认外观，在 Android 上使用 TouchableNativeFeedback 以获得涟漪效果，然后应用一些样式。自定义按钮并非特别难构建或安装，但我们的目标是使 React Native 非常容易学习。通过在核心中添加基本按钮，新手将能够在第一天开发出令人惊叹的东西，而不是花费时间格式化 Button 并学习 Touchable 的细微差别。

Button 旨在在每个平台上都能出色地工作并看起来像原生组件，因此它不会支持自定义按钮的所有花哨功能。它是一个很好的起点，但并不意味着要替换您所有现有的按钮。要了解更多信息，请查看新的 Button 文档，其中包含可运行的示例！

使用 Yarn 加快 react-native init 的速度​

您现在可以使用 Yarn，新的 JavaScript 包管理器，来显着加快 react-native init 的速度。要查看加速效果，请安装 yarn 并将您的 react-native-cli 升级到 1.2.0

$ npm install -g react-native-cli

您现在应该在设置新应用时看到“Using yarn”

在简单的本地测试中，在良好的网络环境下，react-native init 在大约 1 分钟内完成（而使用 npm 3.10.8 时约为 3 分钟）。安装 yarn 是可选的，但强烈建议。

谢谢！​

我们要感谢为本次发布做出贡献的每个人。完整的发布说明现已在 GitHub 上提供。凭借二十多个错误修复和新功能，React Native 在您的帮助下不断变得更好。

今天我们发布了 React Native 0.36。请继续阅读以了解有关新功能的更多信息。

Headless JS​

Headless JS 是一种在您的应用在后台运行时在 JavaScript 中运行任务的方法。例如，它可用于同步新数据、处理推送通知或播放音乐。目前仅在 Android 上可用。

要开始使用，请在专用文件中定义您的异步任务（例如 SomeTaskName.js）

module.exports = async taskData => {
  // Perform your task here.
};

接下来，在 AppRegistry 上注册您的任务

AppRegistry.registerHeadlessTask('SomeTaskName', () =>
  require('SomeTaskName'),
);

使用 Headless JS 确实需要编写一些原生 Java 代码，以便您可以在需要时启动服务。查看我们新的Headless JS 文档以了解更多信息！

Keyboard API​

使用屏幕键盘现在通过 Keyboard 变得更加容易。您现在可以监听原生键盘事件并对其做出反应。例如，要关闭活动键盘，只需调用 Keyboard.dismiss()

import {Keyboard} from 'react-native';

// Hide that keyboard!
Keyboard.dismiss();

Animated Division​

React Native 已经支持通过加法、乘法和取模来组合两个动画值。在 0.36 版本中，现在可以通过除法来组合两个动画值。在某些情况下，动画值需要反转另一个动画值以进行计算。一个示例是反转比例（2x --> 0.5x）

const a = Animated.Value(1);
const b = Animated.divide(1, a);

Animated.spring(a, {
  toValue: 2,
}).start();

然后 b 将跟随 a 的弹簧动画并产生 1 / a 的值。

基本用法如下所示

<Animated.View style={{transform: [{scale: a}]}}>
  <Animated.Image style={{transform: [{scale: b}]}} />
<Animated.View>

在此示例中，内部图像根本不会被拉伸，因为父级的缩放被抵消了。如果您想了解更多信息，请查看动画指南。

深色状态栏​

已向 StatusBar 添加了新的 barStyle 值：dark-content。通过此添加，您现在可以在 Android 和 iOS 上使用 barStyle。现在的行为如下

• default：使用平台默认值（iOS 上为浅色，Android 上为深色）。
• light-content：使用带有黑色文本和图标的浅色状态栏。
• dark-content：使用带有白色文本和图标的深色状态栏。

...以及更多​

以上只是 0.36 中更改内容的一个示例。查看 GitHub 上的发布说明 以查看新功能、错误修复和重大更改的完整列表。

您可以通过在终端中运行以下命令来升级到 0.36

$ npm install --save [email protected]
$ react-native upgrade

来自 Expo 的 Adam Miskiewicz 在上周 Expo 的办公时间谈论了移动导航和 ex-navigation React Native 库。

在将应用发布到应用商店后，国际化是进一步扩大受众范围的下一步。全球有 20 多个国家和众多人使用从右到左 (RTL) 的语言。因此，使您的应用支持 RTL 对于他们来说是必要的。

我们很高兴地宣布，React Native 已经改进以支持 RTL 布局。今天这已在 react-native 主分支中可用，并且将在下一个 RC 中可用：v0.33.0-rc。

这涉及更改 css-layout、RN 使用的核心布局引擎和 RN 核心实现，以及特定的 OSS JS 组件以支持 RTL。

为了在生产中测试 RTL 支持，最新版本的 Facebook 广告管理工具 应用（第一个跨平台 100% RN 应用）现在以阿拉伯语和希伯来语提供，并为 iOS 和 Android 提供 RTL 布局。以下是它在这些 RTL 语言中的外观

RN 中 RTL 支持的概述更改​

css-layout 已经具有布局 start 和 end 的概念。在从左到右 (LTR) 布局中，start 表示 left，end 表示 right。但在 RTL 中，start 表示 right，end 表示 left。这意味着我们可以使 RN 依赖于 start 和 end 计算来计算正确的布局，其中包括 position、padding 和 margin。

此外，css-layout 已经使每个组件的方向从其父组件继承。这意味着，我们只需将根组件的方向设置为 RTL，整个应用就会翻转。

下图描述了高层次的更改

这些包括

• css-layout RTL 支持绝对定位
• 在 RN 核心实现中将 left 和 right 映射到 start 和 end 以用于阴影节点
• 并公开一个 桥接实用程序模块 以帮助控制 RTL 布局

通过此更新，当您允许您的应用使用 RTL 布局时

• 每个组件布局都将水平翻转
• 如果您正在使用支持 RTL 的 OSS 组件，则某些手势和动画将自动具有 RTL 布局
• 可能需要最少的额外工作才能使您的应用完全支持 RTL

使应用支持 RTL​

1. 要支持 RTL，您应该首先将 RTL 语言包添加到您的应用。

   • 请参阅 iOS 和 Android 的通用指南。

2. 通过在原生代码的开头调用 allowRTL() 函数，允许您的应用使用 RTL 布局。我们提供了此实用程序，仅在您的应用准备就绪时才应用于 RTL 布局。这是一个示例

   iOS

   // in AppDelegate.m
     [[RCTI18nUtil sharedInstance] allowRTL:YES];
   

   Android

   // in MainActivity.java
     I18nUtil sharedI18nUtilInstance = I18nUtil.getInstance();
     sharedI18nUtilInstance.allowRTL(context, true);
   

3. 对于 Android，您需要在 AndroidManifest.xml 文件中的 <application> 元素中添加 android:supportsRtl="true"。

现在，当您重新编译您的应用并将设备语言更改为 RTL 语言（例如阿拉伯语或希伯来语）时，您的应用布局应自动更改为 RTL。

编写支持 RTL 的组件​

通常，大多数组件已经支持 RTL，例如

• 从左到右布局

• 从右到左布局

但是，有几种情况需要注意，对于这些情况，您将需要 I18nManager。I18nManager 中有一个常量 isRTL，用于判断应用的布局是否为 RTL，以便您可以根据布局进行必要的更改。

具有方向含义的图标​

如果您的组件具有图标或图像，则它们在 LTR 和 RTL 布局中将以相同的方式显示，因为 RN 不会翻转您的源图像。因此，您应该根据布局样式翻转它们。

• 从左到右布局

• 从右到左布局

以下是根据方向翻转图标的两种方法

• 向图像组件添加 transform 样式

  <Image
    source={...}
    style={{transform: [{scaleX: I18nManager.isRTL ? -1 : 1}]}}
  />
  

• 或者，根据方向更改图像源

  let imageSource = require('./back.png');
  if (I18nManager.isRTL) {
    imageSource = require('./forward.png');
  }
  return <Image source={imageSource} />;
  

手势和动画​

在 Android 和 iOS 开发中，当您更改为 RTL 布局时，手势和动画与 LTR 布局相反。目前，在 RN 中，手势和动画在 RN 核心代码级别不受支持，但在组件级别受支持。好消息是，其中一些组件今天已经支持 RTL，例如 SwipeableRow 和 NavigationExperimental。但是，其他带有手势的组件将需要手动支持 RTL。

说明手势 RTL 支持的一个很好的例子是 SwipeableRow。

手势示例​

// SwipeableRow.js
_isSwipingExcessivelyRightFromClosedPosition(gestureState: Object): boolean {
  // ...
  const gestureStateDx = IS_RTL ? -gestureState.dx : gestureState.dx;
  return (
    this._isSwipingRightFromClosed(gestureState) &&
    gestureStateDx > RIGHT_SWIPE_THRESHOLD
  );
},

动画示例​

// SwipeableRow.js
_animateBounceBack(duration: number): void {
  // ...
  const swipeBounceBackDistance = IS_RTL ?
    -RIGHT_SWIPE_BOUNCE_BACK_DISTANCE :
    RIGHT_SWIPE_BOUNCE_BACK_DISTANCE;
  this._animateTo(
    -swipeBounceBackDistance,
    duration,
    this._animateToClosedPositionDuringBounce,
  );
},

维护支持 RTL 的应用​

即使在最初发布 RTL 兼容应用之后，您也可能需要迭代新功能。为了提高开发效率，I18nManager 提供了 forceRTL() 函数，用于更快地进行 RTL 测试，而无需更改测试设备语言。您可能希望在您的应用中为此提供一个简单的开关。这是 RNTester 中 RTL 示例的示例

<RNTesterBlock title={'Quickly Test RTL Layout'}>
  <View style={styles.flexDirectionRow}>
    <Text style={styles.switchRowTextView}>forceRTL</Text>
    <View style={styles.switchRowSwitchView}>
      <Switch
        onValueChange={this._onDirectionChange}
        style={styles.rightAlignStyle}
        value={this.state.isRTL}
      />
    </View>
  </View>
</RNTesterBlock>;

_onDirectionChange = () => {
  I18nManager.forceRTL(!this.state.isRTL);
  this.setState({isRTL: !this.state.isRTL});
  Alert.alert(
    'Reload this page',
    'Please reload this page to change the UI direction! ' +
      'All examples in this app will be affected. ' +
      'Check them out to see what they look like in RTL layout.',
  );
};

在开发新功能时，您可以轻松切换此按钮并重新加载应用以查看 RTL 布局。这样做的好处是您无需更改语言设置进行测试，但是某些文本对齐方式不会更改，如下一节所述。因此，在发布之前，始终最好在 RTL 语言中测试您的应用。

局限性和未来计划​

RTL 支持应涵盖您应用中的大多数 UX；但是，目前存在一些局限性

• Android 和 iOS 中的文本对齐行为有所不同
  • 在 iOS 中，默认文本对齐方式取决于活动的语言包，它们始终在同一侧。在 Android 中，默认文本对齐方式取决于文本内容的语言，即英语将左对齐，阿拉伯语将右对齐。
  • 从理论上讲，这应该在跨平台之间保持一致，但是当使用应用时，有些人可能更喜欢一种行为而不是另一种行为。可能需要更多的用户体验研究来找出文本对齐的最佳实践。

• 没有“真”左/右

  如前所述，我们将 JS 端的 left/right 样式映射到 start/end，RTL 布局中代码中的所有 left 在屏幕上都变为“right”，代码中的 right 在屏幕上变为“left”。这很方便，因为您无需过多更改产品代码，但这意味着无法在代码中指定“真左”或“真右”。将来，允许组件控制其方向而与语言无关可能是必要的。

• 使手势和动画的 RTL 支持对开发者更加友好

  目前，要使手势和动画与 RTL 兼容，仍然需要进行一些编程工作。将来，最好找到一种使手势和动画 RTL 支持对开发者更加友好的方法。

试用一下！​

查看 RNTester 中的 RTLExample，以了解有关 RTL 支持的更多信息，并告诉我们它对您有何作用！

最后，感谢您的阅读！我们希望 React Native 的 RTL 支持可以帮助您为国际受众扩展您的应用！

上周，我有机会参加在 Zynga 旧金山办公室举行的 React Native Meetup。大约有 200 人参加，这是一个与我附近的其他对 React Native 感兴趣的开发人员会面的好地方。

我特别有兴趣了解更多关于 Zynga、Netflix 和 Airbnb 等公司如何使用 React 和 React Native 的信息。当晚的议程如下：

• React 快速原型开发
• 为 React Native 设计 API
• 弥合差距：在现有代码库中使用 React Native

但首先，活动以快速介绍和近期新闻简报开始

• 您知道吗？React Native 现在是 GitHub 上排名第一的 Java 仓库？
• rnpm 现在是 React Native 核心的一部分了！您现在可以使用 react-native link 代替 rnpm link 来安装带有原生依赖的库。
• React Native Meetup 社区正在快速发展！全球各地各种 React Native meetup 小组现在有超过 4,800 名开发者。

如果这些 meetup 之一在您附近举行，我强烈建议参加！

Zynga 的 React 快速原型开发​

第一轮新闻之后，是 Zynga 的快速介绍，他们是今晚的东道主。Abhishek Chadha 谈到了他们如何使用 React 在移动设备上快速原型化新体验，并演示了一个类似 Draw Something 应用程序的快速原型。他们使用了类似于 React Native 的方法，通过桥接提供对原生 API 的访问。当 Abhishek 使用设备的摄像头拍摄观众的照片，然后在某人的头上画了一顶帽子时，这一点得到了演示。

Netflix 为 React Native 设计 API​

接下来是今晚的第一个专题演讲。Clarence Leung，Netflix 的高级软件工程师，发表了他关于为 React Native 设计 API 的演讲。他首先指出了人们可能从事的两种主要类型的库：组件（如标签栏和日期选择器）以及提供对原生服务（如相机胶卷或应用内支付）访问的库。在为 React Native 构建库时，有两种方法可以采用：

• 提供平台特定的组件
• 一个跨平台库，为 Android 和 iOS 提供类似的 API

每种方法都有其自身的考虑因素，这取决于您来确定哪种方法最适合您的需求。

方法 #1

作为平台特定组件的示例，Clarence 谈到了来自核心 React Native 的 DatePickerIOS 和 DatePickerAndroid。在 iOS 上，日期选择器作为 UI 的一部分呈现，并且可以轻松嵌入到现有视图中，而 Android 上的日期选择器以模态方式呈现。在这种情况下，提供单独的组件是有意义的。

方法 #2

另一方面，照片选择器在 Android 和 iOS 上的处理方式类似。存在一些细微的差异——例如，Android 不像 iOS 那样将照片分组到“自拍”等文件夹中——但这些都可以使用 if 语句和 Platform 组件轻松处理。

无论您选择哪种方法，最好尽量减少 API 表面并构建特定于应用程序的库。例如，iOS 的应用内购买框架支持一次性、消耗性购买以及可续订订阅。如果您的应用程序只需要支持消耗性购买，那么您可以放弃在跨平台库中对订阅的支持。

在 Clarence 的演讲结束后，有一个简短的问答环节。其中一个有趣的细节是，Netflix 为这些库编写的 React Native 代码中，大约 80% 在 Android 和 iOS 之间共享。

弥合差距，在现有代码库中使用 React Native​

当晚的最后一场演讲来自 Airbnb 的 Leland Richardson。演讲的重点是在现有代码库中使用 React Native。我已经知道使用 React Native 从头开始编写一个新应用程序有多么容易，所以我非常想听听 Airbnb 在他们现有的原生应用程序中采用 React Native 的经验。

Leland 首先谈到了绿地应用程序与棕地应用程序。绿地意味着开始一个项目而无需考虑任何先前的工作。这与棕地项目形成对比，在棕地项目中，您需要考虑现有项目的需求、开发流程以及所有团队的各种需求。

当您在开发绿地应用程序时，React Native CLI 会为 Android 和 iOS 设置一个单独的仓库，并且一切正常运行。Airbnb 使用 React Native 的第一个挑战是 Android 和 iOS 应用程序各自拥有自己的仓库。多仓库公司在采用 React Native 之前需要克服一些障碍。

为了解决这个问题，Airbnb 首先为 React Native 代码库设置了一个新的仓库。他们使用其持续集成服务器将 Android 和 iOS 仓库镜像到这个新仓库中。在运行测试并构建 bundle 后，构建工件会同步回 Android 和 iOS 仓库。这允许移动工程师在不更改其开发环境的情况下处理原生代码。移动工程师无需安装 npm、运行打包器或记住构建 JavaScript bundle。编写实际 React Native 代码的工程师不必担心在 Android 和 iOS 之间同步他们的代码，因为他们直接在 React Native 仓库上工作。

这确实带来了一些缺点，主要是他们无法发布原子更新。需要原生和 JavaScript 代码组合的更改将需要三个单独的 pull request，所有这些都必须仔细地进行合并。为了避免冲突，如果 master 自构建开始以来已更改，CI 将无法将更改合并回 Android 和 iOS 仓库。这会在高提交频率的日子（例如，当发布新版本时）导致长时间的延迟。

Airbnb 此后已转向单仓库方法。幸运的是，这已经在考虑之中，并且一旦 Android 和 iOS 团队开始习惯使用 React Native，他们就很乐意加速向单仓库的迁移。

这解决了他们在使用拆分仓库方法时遇到的大部分问题。Leland 确实指出，这确实会对版本控制服务器造成更大的压力，这对于较小的公司来说可能是一个问题。

导航问题​

Leland 演讲的后半部分集中讨论了一个我非常关心的话题：React Native 中的导航问题。他谈到了 React Native 中大量的导航库，包括第一方和第三方库。NavigationExperimental 被提及为看起来很有希望的东西，但最终并不适合他们的用例。

事实上，现有的导航库似乎都不太适合棕地应用程序。棕地应用程序要求导航状态完全由原生应用程序拥有。例如，如果用户的会话在呈现 React Native 视图时过期，原生应用程序应该能够接管并根据需要呈现登录屏幕。

Airbnb 还希望避免在过渡期间用 JavaScript 版本替换原生导航栏，因为这种效果可能会很突兀。最初，他们将自己限制在模态呈现的视图中，但当涉及到在其应用程序中更广泛地采用 React Native 时，这显然会带来问题。

他们决定他们需要自己的库。该库名为 airbnb-navigation。该库尚未开源，因为它与 Airbnb 的代码库紧密相连，但他们希望在年底前发布它。

我不会详细介绍该库的 API，但以下是一些关键要点：

• 必须提前预注册场景
• 每个场景都显示在自己的 RCTRootView 中。它们在每个平台上以原生方式呈现（例如，在 iOS 上使用 UINavigationController）。
• 场景中的主 ScrollView 应包装在 ScrollScene 组件中。这样做可以让您利用原生行为，例如在 iOS 上点击状态栏滚动到顶部。
• 场景之间的过渡以原生方式处理，无需担心性能。
• 自动支持 Android 返回按钮。
• 他们可以通过 Navigator.Config 无 UI 组件来利用基于 View Controller 的导航栏样式。

还有一些注意事项需要牢记：

• 导航栏在 JavaScript 中不易自定义，因为它是一个原生组件。这是故意的，因为使用原生导航栏是此类库的硬性要求。
• ScreenProps 必须在每次通过桥接发送时进行序列化/反序列化，因此如果在此处发送过多数据，则必须小心。
• 导航状态由原生应用程序拥有（也是该库的硬性要求），因此像 Redux 这样的东西无法操作导航状态。

Leland 的演讲之后也进行了问答环节。总的来说，Airbnb 对 React Native 感到满意。他们有兴趣使用 Code Push 来修复任何问题，而无需通过 App Store，并且他们的工程师喜欢 Live Reload，因为他们不必在每次小的更改后都等待原生应用程序重建。

闭幕词​

活动以一些额外的 React Native 新闻结束：

• Deco 发布了他们的 React Native Showcase，并邀请所有人将他们的应用程序添加到列表中。
• 最近的 文档大修 获得了赞扬！
• Deco IDE 的创建者之一 Devin Abbott 将教授入门级 React Native 课程。

Meetup 提供了与社区中其他开发者会面和学习的好机会。我期待着将来参加更多 React Native meetup。如果您参加了其中一个，请留意我，并告诉我我们如何才能让 React Native 更好地为您服务！

拥有出色的开发者体验的一部分是拥有出色的文档。创建好的文档需要付出很多努力——理想的文档应该是简洁、有帮助、准确、完整且令人愉悦的。最近，我们一直在努力根据您的反馈改进文档，并且我们想分享我们所做的一些改进。

内联示例​

当您学习一个新的库、一种新的编程语言或一个新的框架时，当您第一次编写一些代码，尝试运行它，看看它是否有效......并且它确实有效时，会有一个美好的时刻。您创造了真实的东西。我们希望将这种发自内心的体验直接融入到我们的文档中。像这样：

import React, { Component } from 'react';
import { AppRegistry, Text, View } from 'react-native';

class ScratchPad extends Component {
  render() {
    return (
      <View style={{flex: 1}}>
        <Text style={{fontSize: 30, flex: 1, textAlign: 'center'}}>
          Isn't this cool?
        </Text>
        <Text style={{fontSize: 100, flex: 1, textAlign: 'center'}}>
          👍
        </Text>
      </View>
    );
  }
}

AppRegistry.registerComponent('ScratchPad', () => ScratchPad);

我们认为这些内联示例，使用 react-native-web-player 模块并在 Devin Abbott 的帮助下，是学习 React Native 基础知识的好方法，并且我们已更新了我们的面向 React Native 新开发者的教程，尽可能地使用这些示例。查看一下——如果您曾经好奇修改一小段示例代码会发生什么，这是一种非常好的探索方式。此外，如果您正在构建开发者工具，并且想在您自己的网站上展示一个实时的 React Native 示例，react-native-web-player 可以使这变得简单直接。

核心模拟引擎由 Nicolas Gallagher 的 react-native-web 项目提供，该项目提供了一种在 Web 上显示 React Native 组件（如 Text 和 View）的方法。如果您有兴趣构建共享大部分代码库的移动和 Web 体验，请查看 react-native-web。

更好的指南​

在 React Native 的某些部分，有多种方法可以做事，我们已经听取了反馈，我们可以提供更好的指导。

我们有一个新的 导航指南，它比较了不同的方法，并就您应该使用什么给出建议——Navigator、NavigatorIOS、NavigationExperimental。在中期，我们正在努力改进和整合这些接口。在短期内，我们希望更好的指南能让您的生活更轻松。

我们还有一个新的 触摸处理指南，它解释了制作类似按钮的界面的一些基础知识，以及处理触摸事件的不同方法的简要概述。

我们工作的另一个领域是 Flexbox。这包括关于如何使用 Flexbox 处理布局 以及如何控制组件大小的教程。它还包括一个枯燥但希望有用的 React Native 中控制布局的所有 props 的列表。

入门指南​

当您开始在您的机器上设置 React Native 开发环境时，您确实需要做很多安装和配置的事情。很难让安装成为一个真正有趣和令人兴奋的体验，但我们至少可以使其尽可能快速和轻松。

我们构建了一个新的入门指南工作流程，让您可以预先选择您的开发操作系统和您的移动操作系统，以提供一个简洁的地方，其中包含所有设置说明。我们还经历了安装过程，以确保一切正常运行，并确保每个决策点都有明确的建议。在我们的无辜同事身上测试之后，我们非常确定这是一个改进。

我们还致力于 将 React Native 集成到现有应用程序的指南。许多使用 React Native 的最大型应用程序，例如 Facebook 应用程序本身，实际上是在 React Native 中构建应用程序的一部分，并使用常规开发工具构建另一部分。我们希望本指南能让更多人更容易地以这种方式构建应用程序。

我们需要您的帮助​

您的反馈让我们知道我们应该优先考虑什么。我知道有些人会阅读这篇博文，并认为“更好的文档？切！X 的文档仍然是垃圾！”。这很好——我们需要这种能量。向我们提供反馈的最佳方式取决于反馈的类型。

如果您在文档中发现错误，例如不准确的描述或实际上无法工作的代码，请提交 issue。用“Documentation”标记它，以便更容易将其路由到合适的人员。

如果没有具体的错误，但文档中的某些内容从根本上令人困惑，则不适合在 GitHub issue 中提出。相反，请在 Canny 上发布关于文档中可能需要帮助的区域的帖子。这有助于我们在进行更一般的工作（如编写指南）时确定优先级。

感谢您阅读到这里，并感谢您使用 React Native！

自从我们开源 React Native 以来，已经一年了。最初只是少数工程师的想法，现在已成为 Facebook 内外产品团队使用的框架。今天在 F8 上，我们宣布 Microsoft 正在将 React Native 带到 Windows 生态系统，使开发者有可能在 Windows PC、手机和 Xbox 上构建 React Native。它还将提供开源工具和服务，例如 Visual Studio Code 的 React Native 扩展和 CodePush，以帮助开发者在 Windows 平台上创建 React Native 应用程序。此外，三星正在为其混合平台构建 React Native，这将使开发者能够为数百万台智能电视以及移动和可穿戴设备构建应用程序。我们还发布了 Facebook SDK for React Native，这使得开发者可以更轻松地将 Facebook 社交功能（如登录、分享、应用分析和 Graph API）整合到他们的应用程序中。在一年内，React Native 改变了开发者在每个主要平台上构建应用程序的方式。

这是一段史诗般的旅程——但我们才刚刚开始。回顾一下 React Native 自一年前开源以来是如何成长和发展的，我们在此过程中面临的一些挑战，以及我们对未来的期望。

这是一个摘录。在 Facebook 代码上阅读帖子的其余部分。

React Native 允许您使用 React 和 Relay 的声明式编程模型在 JavaScript 中构建 Android 和 iOS 应用程序。这使得代码更简洁、更易于理解；快速迭代而无需编译周期；以及跨多个平台轻松共享代码。您可以更快地交付并专注于真正重要的细节，使您的应用程序看起来和感觉都很棒。优化性能是其中重要的一部分。这是我们如何使 React Native 应用程序启动速度提高一倍的故事。

为什么要赶时间？​

对于运行速度更快的应用程序，内容加载速度更快，这意味着人们有更多时间与之交互，流畅的动画使应用程序使用起来更愉快。在新兴市场，2011 年的旧款手机在 2G 网络上占多数，对性能的关注可以决定应用程序是可用还是不可用。

自从在 iOS 和 Android 上发布 React Native 以来，我们一直在改进列表视图滚动性能、内存效率、UI 响应速度和应用程序启动时间。启动设置了应用程序的第一印象，并强调了框架的所有部分，因此它是最值得和最具挑战性的问题。

这是一个摘录。在 Facebook 代码上阅读帖子的其余部分。