「release」タグ付きの投稿 19 件

本日、Android 12とiOS 15のサポート、修正、および一般的なアップデートと共に、React Native v0.66をリリースします。

ハイライト​

• Androidで親バウンダリの外部のビューのタップを処理する
• Androidでの新しいBluetoothパーミッション
• Apple Silicon、Xcode 13、iOS 15のより良いサポート
• Hermes 0.9.0
• ナイトリーリリースと「コミットリー」リリース

本日、新しいバージョンのHermes、アクセシビリティの改善、パッケージのアップグレードなどを含む、React Nativeバージョン0.65をリリースします。

Hermes 0.8の新機能​

React Native向けに最適化されたFacebookのオープンソースJavaScript VMであるHermesがバージョン0.8.1にアップグレードされました。このリリースにおける注目すべき機能の一部は以下のとおりです。

• 「Hades」と呼ばれる新しいコンカレントガベージコレクターは、64ビットデバイスで最大30倍短いポーズタイムを実現します。Facebookでは、これにより、CPUを集中して使用するワークロードが20〜50％向上しました。Hadesの詳細はこちらをご覧ください。
• ECMAScript国際化API（ECMA-402、またはIntl）がAndroidでHermesに組み込まれ、デフォルトで有効になりました。APIサイズオーバーヘッドは57〜62KBのみです（JSCの6MiBと比較）。この変更により、Hermesユーザーはロケールポリフィルを必要としなくなります。この実装を推進して実現してくれた@mganandrajとMicrosoftの他のパートナーに感謝します！
• iOSのHermesは、Apple M1 MacとMac Catalystをサポートするようになりました！
• SMI（Small Integers）とポインター圧縮を含むメモリの改善により、JSヒープが30％縮小されました。
• Function.prototype.toStringへの変更により、不適切な機能検出によるパフォーマンス低下が修正され、ソースコードの注入ユースケースがサポートされました。

Hermesの変更ログ全文はこちら。

手順はこちらに従って、まだ行っていない場合はアプリでHermesをオプトインし、これらの新機能と利点を活用しましょう！

アクセシビリティの修正と追加​

昨年、FacebookはGAAD誓約を行い、React Native内のアクセシビリティを向上させました。0.65はこの誓約の結果と、その他のアクセシビリティの成果を共有しています！注目すべき変更点には、以下が含まれます。

• iOSで高コントラストの明度と暗度の値を指定できるようにしました。ドキュメントで詳細を確認してください。
• AndroidでgetRecommendedTimeoutMillis APIを追加しました。これにより、Androidのアクセシビリティオプションで設定されたユーザーの推奨デフォルトタイムアウト値が公開されます。これは、コントロールの確認や操作に余分な時間が必要なユーザー向けです。
• TalkBack/VoiceOverがdisabledやunselectedなどのUIの状態をコンポーネントで適切に読み上げるように、一般的な修正を行いました。

未解決のアクセシビリティの問題はこちらで確認したり、貢献したりできます！

注目すべき依存関係のバージョンの更新と注意点​

• package.jsonでdevDependencyとしてreact-native-codegenバージョン0.0.7が必要になりました。
• JCenterは廃止され、現在は読み取り専用です。JCenterをMavenリポジトリから削除し、依存関係をMavenCentralとJitpackを使用するように更新しました。
• OkHttpをv3からv4.9.1にアップグレードしました。OkHttp 4へのアップグレードで変更の詳細を確認してください。
• Xcode 12.5をサポートするためにFlipper 0.93にアップグレードしました。Flipperの変更ログはこちら。
• Android Gradle Plugin 7のサポート
• Apple Siliconにはリンカーの回避策が必要です。@mikehardyによるこの件に関するメモを参照してください。

感謝の言葉​

このリリースには、61人のコントリビューターによる1100件以上のコミットが含まれています。このリリースに貢献し、サポートしてくれた皆様に感謝申し上げます！変更ログ全文はこちら。

本日、iOSでHermesのサポートを提供するReact Native 0.64をリリースします。

iOSでのHermesオプトイン​

Hermesは、React Nativeの実行に最適化されたオープンソースのJavaScriptエンジンです。メモリ使用量の削減、ダウンロードサイズの縮小、アプリが使用可能になるまでの時間（対話時間、TTI）の短縮により、パフォーマンスを向上させます。

今回のリリースでは、iOSでもHermesを使用できるようになったことをお知らせいたします。iOSでHermesを有効にするには、`Podfile`で`hermes_enabled`を`true`に設定し、`pod install`を実行してください。

use_react_native!(
   :path => config[:reactNativePath],
   # to enable hermes on iOS, change `false` to `true` and then install pods
   :hermes_enabled => true
)

iOSにおけるHermesのサポートはまだ初期段階であることにご注意ください。現在もベンチマークテストを実施しているため、オプトイン方式としています。皆様のアプリケーションでお試しいただき、ご意見をお寄せいただければ幸いです！

デフォルトで有効化されたインラインRequire ​

インラインRequireは、Metroの設定オプションです。起動時にJavaScriptモジュールを実行するのではなく、使用されるまで実行を遅らせることで、起動時間を短縮します。

この機能は数年前からオプトイン設定オプションとして存在し、推奨されてきました。ドキュメントのパフォーマンスセクションに記載されています。今回、新しいアプリケーションではこのオプションをデフォルトで有効化することにより、追加の設定なしで高速なReact Nativeアプリケーションを実現できるようにしました。

インラインRequireは、モジュールインポートを処理してインライン化するBabel変換です。例として、インラインRequireは、ファイルの先頭にあるこのモジュールインポート呼び出しを、使用されている場所に移動します。

変更前

import {MyFunction} from 'my-module';

const MyComponent = props => {
  const result = MyFunction();

  return <Text>{result}</Text>;
};

変更後

const MyComponent = props => {
  const result = require('my-module').MyFunction();

  return <Text>{result}</Text>;
};

インラインRequireの詳細については、パフォーマンスドキュメントをご覧ください。

ChromeでHermesトレースを表示する ​

昨年、FacebookはMajor League Hackingフェローシップをスポンサーし、React Nativeへの貢献を支援しました。Jessie NguyenとSaphal Patroは、Hermesを使用している場合に、Chrome DevToolsのパフォーマンスタブを使用してアプリケーションの実行を視覚化できるようにしました。

詳細については、新しいドキュメントページをご覧ください。

Proxyサポート付きHermes ​

HermesにProxyサポートを追加しました。これにより、react-native-firebaseやmobxなどの一般的なコミュニティプロジェクトとの互換性が向上します。これらのパッケージを使用している場合は、プロジェクトをHermesに移行できるようになりました。

今後のリリースで、HermesをAndroidのデフォルトJavaScriptエンジンにする予定です。そのため、Hermesを使用する際に発生する残りの問題を解決するために取り組んでいます。アプリのHermesへの移行を妨げている問題があれば、HermesのGitHubリポジトリで問題を報告してください。

React 17 ​

React 17には、新しい開発者向け機能や主要な破壊的変更は含まれていません。React Nativeアプリケーションにとって主な変更点は、新しいJSX変換で、JSXを使用するためにファイルでReactをインポートする必要がなくなったことです。

React 17の詳細については、Reactブログをご覧ください。

主要な依存関係のバージョン変更 ​

• Android APIレベル16～20を削除しました。Facebookアプリでは、使用率が十分に低いAndroidバージョンに対するサポートが継続的に削除されています。Facebookアプリがこれらのバージョンをサポートしなくなり、React Nativeの主要なテスト環境となっているため、React Nativeでもサポートを削除します。
• Xcode 12とCocoaPods 1.10が必要です。
• Nodeの最小サポートバージョンが10から12に引き上げられました。
• Flipperが0.75.1にアップデートされました。

謝辞 ​

0.64のリリースに貢献してくださった数百人のコントリビューターに感謝いたします！0.64の変更ログには、このリリースに含まれるすべての変更が記載されています。

本日、LogBoxをデフォルトで有効にしたReact Native 0.63をリリースします。

LogBox ​

React Nativeでエラーや警告のデバッグが難しいというコミュニティからのフィードバックを頻繁に受けてきました。これらの問題に対処するために、React Nativeのエラー、警告、ログシステム全体を見直し、一から設計し直しました。

LogBoxは、React Nativeのredbox、yellowbox、およびロギングエクスペリエンスを完全に再設計したものです。0.62ではLogBoxをオプトインとして導入しましたが、今回のリリースでは、すべてのReact Nativeでデフォルトのエクスペリエンスとして提供します。

LogBoxは、エラーと警告が冗長すぎる、フォーマットが不適切である、または対処できないという不満に対処するために、次の3つの主要な目標に焦点を当てています。

• **簡潔性:** ログは、問題のデバッグに必要な最小限の情報を提供する必要があります。
• **フォーマット:** ログは、必要な情報を迅速に見つけることができるようにフォーマットする必要があります。
• **対処可能性:** ログは対処可能である必要があります。そのため、問題を修正して先に進むことができます。

これらの目標を達成するために、LogBoxには次のものが含まれています。

• **ログ通知:** 警告通知を再設計し、エラーのサポートを追加しました。これにより、すべての`console.warn`と`console.log`メッセージが、アプリを覆う代わりに通知として表示されます。
• **コードフレーム:** すべてのエラーと警告には、ログのソースコードがアプリ内に表示されるコードフレームが含まれるようになりました。これにより、問題の原因を迅速に特定できます。
• **コンポーネントスタック:** すべてのコンポーネントスタックは、エラーメッセージから削除され、上位3つのフレームが表示された独自のセクションに配置されるようになりました。これにより、ログメッセージを混乱させることなく、スタックフレーム情報の期待できる一貫性のある単一のスペースが提供されます。
• **スタックフレームの折りたたみ:** デフォルトでは、アプリケーションのコードに関連しない呼び出しスタックフレームが折りたたまれるようになりました。これにより、アプリの問題を迅速に確認でき、React Nativeの内部を詳しく調べる必要がなくなります。
• **構文エラーのフォーマット:** 構文エラーのフォーマットを改善し、構文ハイライト付きのコードフレームを追加しました。これにより、エラーの原因を確認し、修正して、React Nativeの邪魔を受けることなくコーディングを続けることができます。

これらの機能をすべて、エラーと警告間で一貫性のある、改良された視覚デザインにまとめました。これにより、1つの使いやすいUIですべてのログをページングできます。

この変更に伴い、LogBox APIの代わりにYellowBoxを非推奨とします。

• `LogBox.ignoreLogs()`：この関数は、指定された文字列または正規表現に一致するログを抑制する方法として、`YellowBox.ignoreLogs([])`に置き換わります。
• `LogBox.ignoreAllLogs()`：この関数は、エラーまたは警告通知をオフにする方法として、`console.disableYellowBox`に置き換わります。注：これは通知のみを無効にします。キャッチされないエラーは、引き続き全画面LogBoxを開きます。

0.63では、これらの非推奨のモジュールまたはメソッドを使用している場合に警告が表示されます。0.64で削除される前に、これらのAPIからの呼び出しサイトを更新してください。

LogBoxとReact Nativeのデバッグの詳細については、こちらのドキュメントを参照してください。

Pressable ​

React Nativeは、アプリケーションがプラットフォームのユーザーの期待を満たせるように構築されています。これには、「ヒント」—React Nativeで構築されたエクスペリエンスであることを示す小さなもの—を避けることが含まれます。これらのヒントの主な原因の1つは、Touchableコンポーネント（`Button`、`TouchableWithoutFeedback`、`TouchableHighlight`、`TouchableOpacity`、`TouchableNativeFeedback`、`TouchableBounce`）です。これらのコンポーネントにより、ユーザーインタラクションへの視覚的なフィードバックを提供することで、アプリケーションをインタラクティブにできます。ただし、プラットフォームのインタラクションと一致しない組み込みのスタイルとエフェクトが含まれているため、ユーザーはエクスペリエンスがReact Nativeで記述されていることがわかります。

さらに、React Nativeが成長し、高品質なアプリケーションに対する基準が高まるにつれて、これらのコンポーネントは成長していません。React Nativeは現在、Web、デスクトップ、TVなどのプラットフォームをサポートしていますが、追加の入力モダリティのサポートが不足していました。React Nativeは、すべてのプラットフォームで高品質なインタラクションエクスペリエンスをサポートする必要があります。

これらの問題に対処するために、`Pressable`という新しいコアコンポーネントを提供しています。このコンポーネントを使用して、さまざまな種類のインタラクションを検出できます。このAPIは、親コンポーネントで手動で状態を維持する必要なく、インタラクションの現在の状態に直接アクセスできるように設計されました。また、ホバー、ブラー、フォーカスなどを含む機能を拡張できるように設計されています。ほとんどの人は、`TouchableOpacity`などのデフォルトのエクスペリエンスに依存するのではなく、内部で`Pressable`を利用してコンポーネントを作成し、共有すると予想されます。

import {Pressable, Text} from 'react-native';

<Pressable
  onPress={() => {
    console.log('pressed');
  }}
  style={({pressed}) => ({
    backgroundColor: pressed ? 'lightskyblue' : 'white',
  })}>
  <Text style={styles.text}>Press Me!</Text>
</Pressable>;

動作中のPressableコンポーネントの簡単な例

ドキュメントで詳細を確認できます。

ネイティブカラー（PlatformColor、DynamicColorIOS） ​

すべてのネイティブプラットフォームには、システム定義の色という概念があります。ライトモードやダークモードなどのシステムテーマ設定、高コントラストモードなどのアクセシビリティ設定、含まれているビューやウィンドウの特性など、アプリ内のコンテキストにも自動的に対応する色です。

`Appearance`APIや`AccessibilityInfo`を使用してこれらの設定を検出し、それに応じてスタイルを設定することは可能ですが、そのような抽象化は開発コストが高く、ネイティブカラーの外観を近似しているに過ぎません。これらの不一致は、React Native要素とネイティブ要素が共存するハイブリッドアプリケーションで特に目立ちます。

React Nativeは、これらのシステムカラーを使用するためのすぐに使えるソリューションを提供するようになりました。`PlatformColor()`は、React Nativeの他の色と同じように使用できる新しいAPIです。

たとえば、iOSでは、システムは`labelColor`と呼ばれる色を提供しています。これは、次のように`PlatformColor`を使用してReact Nativeで使用できます。

import {Text, PlatformColor} from 'react-native';

<Text style={{color: PlatformColor('labelColor')}}>
  This is a label
</Text>;

Textコンポーネントの色を、iOSで定義されている`labelColor`に設定します。

一方、Androidは`colorButtonNormal`などの色を提供しています。これは、次のようにReact Nativeで使用できます。

import {View, Text, PlatformColor} from 'react-native';

<View
  style={{
    backgroundColor: PlatformColor('?attr/colorButtonNormal'),
  }}>
  <Text>This is colored like a button!</Text>
</View>;

Viewコンポーネントの背景色を、Androidで定義されている`colorButtonNormal`に設定します。

`PlatformColor`の詳細については、ドキュメントを参照してください。また、RNTesterにある実際のコード例も確認できます。

`DynamicColorIOS`は、iOS専用のAPIで、ライトモードとダークモードで使用する色を定義できます。`PlatformColor`と同様に、これは色が使用できる場所であればどこでも使用できます。`DynamicColorIOS`は、内部的にiOSの`colorWithDynamicProvider`を使用します。

import {Text, DynamicColorIOS} from 'react-native';

const customDynamicTextColor = DynamicColorIOS({
  dark: 'lightskyblue',
  light: 'midnightblue',
});

<Text style={{color: customDynamicTextColor}}>
  This color changes automatically based on the system theme!
</Text>;

システムテーマに基づいてテキストの色を変更します。

DynamicColorIOSの詳細については、ドキュメントをご覧ください。

iOS 9とNode.js 8のサポート終了​

リリースから4年以上経過したため、iOS 9のサポートを終了します。この変更により、特定のiOSバージョンで特定の機能がサポートされているかどうかを検出するためにネイティブコードに配置する必要のある互換性チェックの数を減らすことができるようになり、開発速度を向上させることができます。市場シェアが1％であるため、お客様への悪影響はほとんどありません。

同時に、Node 8のサポートも終了します。LTSメンテナンスサイクルは2019年12月に終了しました。現在のLTSはNode 10であり、これが現在ターゲットとしているバージョンです。React Nativeアプリケーションの開発にNode 8を引き続き使用している場合は、最新のセキュリティ修正とアップデートを受信するためにアップグレードすることをお勧めします。

その他の重要な改善点​

• <Text />内で<View />を明示的なサイズなしでレンダリングするサポート: 幅と高さを明示的に設定せずに、任意の<View />を任意の<Text />コンポーネント内でレンダリングできるようになりました。以前のReact Nativeリリースでは、これによりRedBoxが表示されていました。
• iOS LaunchScreenをxibからstoryboardに変更: 2020年4月30日から、App Storeに提出されるすべてのアプリは、アプリの起動画面にXcode storyboardを使用する必要があり、すべてのiPhoneアプリはすべてのiPhone画面をサポートする必要があります。このコミットにより、デフォルトのReact Nativeテンプレートがこの要件に準拠するように調整されています。

謝辞 ​

0.63を可能にした何百人もの貢献者の方々に感謝します！

LogBoxに関するセクションの作成に貢献してくれたRick Hanlon氏と、この記事のPressable部分の作成に貢献してくれたEli White氏に特別な感謝を申し上げます。

すべてのアップデートを確認するには、0.63の変更ログをご覧ください。

本日、FlipperをデフォルトでサポートするReact Nativeバージョン0.62をリリースします。

このリリースは、世界的なパンデミックの最中に発表されます。このリリースを可能にした何百人もの貢献者の方々の努力を尊重し、リリースがmasterからあまり遅れすぎないようにするために、本日このバージョンをリリースします。問題の解決に貢献できる能力の低下に留意し、必要に応じてアップグレードの延期を検討してください。

デフォルトでFlipper​

Flipperは、モバイルアプリのデバッグのための開発者ツールです。AndroidとiOSのコミュニティで人気があり、このリリースでは、新規および既存のReact Nativeアプリでデフォルトでサポートが有効になりました。

Flipperは、すぐに使用できる次の機能を提供します。

• Metro Actions: ツールバーから直接アプリをリロードし、Dev Menuをトリガーします。
• Crash Reporter: AndroidおよびiOSデバイスからのクラッシュレポートを表示します。
• React DevTools: 最新バージョンのReact DevToolsを他のすべてのツールと一緒に使用します。
• Network Inspector: デバイスアプリケーションによって行われたすべてのネットワークリクエストを表示します。
• Metroおよびデバイスログ: Metroとデバイスの両方のログをすべて表示、検索、フィルタリングします。
• ネイティブレイアウトインスペクタ: React Nativeレンダラーによって出力されたネイティブレイアウトを表示および編集します。
• データベースおよびプリファレンスインスペクタ: デバイスのデータベースとプリファレンスを表示および編集します。

さらに、Flipperは拡張可能なプラットフォームであるため、NPMからプラグインを取得するマーケットプレイスを提供しており、ワークフローに固有のカスタムプラグインを公開およびインストールできます。利用可能なプラグインはこちらを参照してください。

詳細については、Flipperのドキュメントをご覧ください。

新しいダークモード機能​

ユーザーの外観設定（好ましい配色スキーム（明または暗））にアクセスするための新しいAppearanceモジュールを追加しました。

const colorScheme = Appearance.getColorScheme();
if (colorScheme === 'dark') {
  // Use dark color scheme
}

ユーザー設定の状態の更新を購読するためのフックも追加しました。

import {Text, useColorScheme} from 'react-native';

const MyComponent = () => {
  const colorScheme = useColorScheme();
  return <Text>useColorScheme(): {colorScheme}</Text>;
};

詳細については、AppearanceとuseColorSchemeのドキュメントをご覧ください。

Apple TVをreact-native-tvosに移行​

Lean Coreの取り組みの一環として、React Native WindowsやReact Native macOSなどの他のプラットフォームとApple TVを連携させるために、コアからApple TV固有のコードの削除を開始しました。

今後は、React NativeのApple TVサポートは、対応するreact-native-tvos NPMパッケージと共にreact-native-community/react-native-tvosで維持されます。これはメインリポジトリの完全なフォークであり、Apple TVをサポートするために必要な変更のみが含まれています。

react-native-tvosのリリースは、React Nativeのパブリックリリースに基づいています。このreact-nativeの0.62リリースでは、Apple TVプロジェクトをreact-native-tvos 0.62を使用するようにアップグレードしてください。

アップグレードサポートの強化​

0.61がリリースされたとき、コミュニティは、React Nativeの新しいバージョンにアップグレードする開発者をサポートするために、新しいアップグレードヘルパーツールを導入しました。アップグレードヘルパーは、現在のバージョンからターゲットとするバージョンへの変更の差分を提供し、特定のアップグレードに必要な変更を確認できます。

このツールを使用しても、アップグレード時に問題が発生します。本日、Upgrade-Supportを発表することにより、より専用のアップグレードサポートを導入します。Upgrade Supportは、ユーザーがプロジェクトのアップグレードに固有の問題を提出してコミュニティからの支援を受けられるGitHubの問題トラッカーです。

アップグレードエクスペリエンスの改善に常に取り組んでおり、これらのツールにより、まだ対処していないエッジケースでユーザーに必要なサポートを提供できると期待しています。

その他の改善点​

• LogBox: 新しいLogBoxエラーおよび警告エクスペリエンスをオプトインとして追加しました。有効にするには、require('react-native').unstable_enableLogBox()をindex.jsファイルに追加します。
• React DevTools v4: この変更には、最新のReact DevToolsへのアップグレードが含まれており、パフォーマンスの大幅な向上、ナビゲーションエクスペリエンスの改善、React Hooksの完全サポートを提供します。
• アクセシビリティの改善: accessibilityValueの追加、Touchablesでのプロップの不足、onSlidingComplete アクセシビリティイベント、Switchコンポーネントのデフォルトの役割を"button"から"switch"に変更するなど、アクセシビリティが改善されました。

破壊的変更​

• PropTypesの削除: React Nativeコアのアプリサイズの影響を軽減し、実行時ではなくコンパイル時にチェックする静的型システムを優先するために、コアコンポーネントからpropTypesを削除します。
• accessibilityStatesの削除: 削除済みのaccessibilityStatesプロパティを、コンポーネントがアクセシビリティサービスに状態に関する情報をより意味的に記述するための新しいaccessibilityStateプロップに置き換えました。
• TextInputの変更: 一般的ではなく、W3Cに準拠しておらず、Fabricで実装が困難であるため、onTextInputをTextInputから削除しました。また、文書化されていないinputViewプロップとselectionStateも削除しました。

非推奨化​

• AccessibilityInfo.fetchは既に非推奨でしたが、このリリースでは警告を追加しました。
• 将来、デフォルトを切り替えるために、useNativeDriverの設定が必須になりました。
• Animatedコンポーネントのrefは、内部コンポーネントになり、getNodeは非推奨になりました。

謝辞 ​

0.62を可能にした何百人もの貢献者の方々に感謝します！

すべてのアップデートを確認するには、0.62の変更ログをご覧ください。

新しいリロードエクスペリエンス「Fast Refresh」を含むReact Native 0.61を発表できることを嬉しく思います。

Fast Refresh​

React Nativeコミュニティによくある問題点について尋ねたところ、上位の回答の1つは「ホットリロード」機能が壊れているということでした。関数コンポーネントでは信頼性高く動作せず、画面を更新できないことが多く、タイプミスやミスに対して回復力もありませんでした。多くの人が信頼性が低すぎるため、オフにしていたと聞いています。

React Native 0.61では、既存の「ライブリロード」（保存時のリロード）と「ホットリロード」機能を「Fast Refresh」という単一の新しい機能に統合しました。Fast Refreshは、以下の原則に基づいてゼロから実装されました。

• Fast Refreshは、関数コンポーネントやHooksを含む最新のReactを完全にサポートします。
• Fast Refreshは、タイプミスやその他のミスにも適切に対応し、必要に応じて完全なリロードにフォールバックします。
• Fast Refreshは、侵入的なコード変換を行いませんそのため、デフォルトで有効にするのに十分な信頼性があります。

Fast Refreshの動作を確認するには、このビデオをご覧ください。

ぜひお試しいただき、ご意見をお聞かせください！必要に応じて、Dev Menu（iOSではCmd+D、AndroidではCmd+MまたはCtrl+M）で無効にすることができます。オンとオフの切り替えは瞬時に行えるため、いつでも変更できます。

Fast Refreshに関するいくつかのヒントを以下に示します。

• Fast Refreshは、デフォルトで関数コンポーネント（およびHooks！）のReactローカル状態を保持します。
• 編集ごとにReactの状態をリセットする必要がある場合は、そのコンポーネントを含むファイルに特別なコメント// @refresh resetを追加できます。
• Fast Refreshは、状態を保持せずにクラスコンポーネントを常に再マウントします。これにより、確実に動作します。
• 誰もがコードでミスをします！Fast Refreshは、ファイルを保存した後、レンダリングを自動的に再試行します。構文エラーやランタイムエラーを修正した後、アプリを手動でリロードする必要はありません。
• 編集中にconsole.logまたはdebuggerステートメントを追加することは、優れたデバッグテクニックです。

Fast Refreshに関する問題については、GitHubで報告してください。調査いたします。

その他の改善点​

• `use_frameworks!` CocoaPodsサポートを修正。0.60では、CocoaPodsをデフォルトで統合するためにいくつかの更新を行いました。残念ながら、これにより`use_frameworks!`を使用しているビルドが壊れてしまいました。これは0.61で修正され、動的フレームワークでビルドする必要があるiOSプロジェクトへのReact Nativeの統合が容易になりました。
• `useWindowDimensions` Hookの追加。この新しいHookは、自動的に寸法の更新を提供および購読し、ほとんどの場合、Dimensions APIの代わりに使用できます。
• Reactが16.9にアップグレードされました。このバージョンでは、UNSAFE_ライフサイクルメソッドの古い名前が非推奨となり、`act`への改善などが含まれています。自動移行スクリプトおよび詳細については、React 16.9のブログ投稿を参照してください。

破壊的変更​

• React .xcodeprojの削除。0.60では、CocoaPodsによる自動リンクサポートを導入しました。また、CocoaPodsをe2eテスト実行に統合したため、これからはRNをiOSアプリに統合するための統一された標準的な方法ができました。これにより、React .xcodeprojのサポートは事実上非推奨となり、0.61からファイルが削除されました。注：0.60の自動リンクを既に使用している場合は、影響を受けることはありません。

謝辞 ​

0.61を可能にしたすべての貢献者の方々に感謝します！

すべての更新を確認するには、0.61の変更ログをご覧ください。

数百人の貢献者による数ヶ月間の努力を経て、React Native Coreチームはバージョン0.60のリリースを発表できることを誇りに思います。このリリースでは、AndroidとiOSの両プラットフォームで重要な移行処理が行われ、多くの問題も解決されました。このブログ投稿では、リリースのハイライトについて説明します。ただし、常に変更ログを参照して、より詳細な情報を確認してください。最後に、このマイルストーン達成に貢献してくれた皆様に感謝いたします！

アクセシビリティへの焦点​

`announceForAccessibility`のようなアクセシビリティAPIに多くの改善が加えられ、ロール、アクションサポート、フラグなどが改善されました。アクセシビリティは複雑な科学ですが、これらの改善により、A11Yの取り組みが少し容易になることを願っています。2019年6月のReact Nativeオープンソースアップデートで、これらの変更の詳細を確認してください。

新たなスタート​

React Nativeのスタート画面が更新されました！新しいUIの作成に貢献してくれた多くの貢献者の方々に感謝します。この新しい「Hello World」は、よりフレンドリーで魅力的な方法で、ユーザーをエコシステムに歓迎します。

AndroidXサポート​

AndroidXは、Androidエコシステムにおける大きな一歩であり、古いサポートライブラリアーティファクトは非推奨になっています。0.60では、React NativeがAndroidXに移行されました。これは破壊的変更であり、ネイティブコードと依存関係も移行する必要があります。

この変更により、React NativeアプリはAndroidX自体を使用する必要があります。1つのアプリ内でこれらを併用することはできないため、アプリコードと依存関係コードのすべてで、どちらか一方を使用する必要があります。

matt-oakes on discussions-and-proposals

独自のネイティブコードは自分で移行する必要がありますが、@mikehardy、@cawfree、および@m4tt72は、`node_modules`をパッチするための「jetifier」という巧妙なツールを構築しました。ライブラリメンテナーはアップグレードする必要がありますが、このツールはAndroidXバージョンをリリースする時間を与えながら、一時的な解決策を提供します。そのため、AndroidX移行に関連するエラーが見つかった場合は、これを試してみてください。

デフォルトでのCocoaPods​

CocoaPodsは、React NativeのiOSプロジェクトの一部になりました。まだ行っていない場合は、これからは`xcworkspace`ファイルを使用してiOSプラットフォームコードを開くようにしてください（プロチップ：ルートプロジェクトディレクトリから`xed ios`を試してください）。また、内部パッケージの`podspec`がXcodeプロジェクトと互換性を持たせるように変更されたため、トラブルシューティングとデバッグが容易になります。このエキサイティングなサポートを実現するために、0.60へのアップグレードの一環として、`Podfile`にいくつかの簡単な変更を加える必要があります。`use_frameworks!`との互換性の問題があることを認識しており、回避策と将来のパッチに関する問題を追跡しています。

Lean Coreの削除​

WebViewとNetInfoは以前は別々のリポジトリに抽出されており、0.60ではReact Nativeリポジトリからそれらを移行し終わりました。さらに、新しいApp Storeポリシーに関するコミュニティからのフィードバックに応えて、Geolocationが抽出されました。まだ行っていない場合は、react-native-webview、@react-native-community/netinfo、および@react-native-community/geolocationへの依存関係を追加することで移行を完了してください。自動化されたソリューションが必要な場合は、rn-upgrade-deprecated-modulesの使用を検討してください。メンテナーは抽出以降、これらのリポジトリに100以上のコミットを行い、コミュニティのサポートに興奮しています！

ネイティブモジュールは自動的にリンクされるようになりました​

React Native CLIに取り組んでいるチームは、自動リンクと呼ばれるネイティブモジュールのリンクに大きな改善を加えました！ほとんどのシナリオでは、`react-native link`を使用する必要がなくなります。同時に、チームは一般的なリンクプロセスを全面的に見直しました。上記のドキュメントで説明されているように、既存の依存関係はすべて`react-native unlink`してください。

アップグレードヘルパー​

@lucasbento、@pvinis、@kelset、および@watadarkstarは、アップグレードプロセスを簡素化するためのUpgrade Helperという優れたツールを構築しました。これは、React Nativeユーザーがブラウンフィールドアプリや複雑なカスタマイズで、バージョン間の変更を確認するのに役立ちます。更新されたアップグレードに関するドキュメントを確認し、今日からアップグレードパスでお試しください！

ライブラリメンテナーへのメモ​

AndroidXへの変更は、ほぼ確実にライブラリのアップデートが必要になりますので、早急にサポートを含めるようにしてください。まだアップグレードできない場合は、jetifierを使ってライブラリをチェックし、ユーザーがビルド時にライブラリをパッチできることを確認してください。

設定とREADMEを更新するには、オートリンキングに関するドキュメントを確認してください。ライブラリの以前の統合方法によっては、追加の変更が必要になる場合があります。依存関係インターフェースの定義方法については、CLIの依存関係に関するガイドを参照してください。

謝辞 ​

これらは私たちが注目したハイライトですが、他にも多くのエキサイティングなアップデートがあります。すべてのアップデートを見るには、変更ログをご覧ください。いつものように、今後のニュースにご期待ください。それまでの間、0.60をお楽しみください！

React Native 0.59リリースへようこそ！これは88人の貢献者による644コミットを含む、またひとつ大きなリリースです。貢献は様々な形でありますので、問題のメンテナンス、コミュニティの育成、React Nativeに関する教育をしてくださった皆様に感謝いたします。今月は多くの待望の変更が含まれており、皆様に喜んでいただければ幸いです。

🎣 Hooksが登場​

このリリースには、状態を持つロジックをコンポーネント間で再利用できるReact Hooksが含まれています。Hooksについては多くの話題がありますが、まだ聞いたことがない方は、以下の素晴らしいリソースをご覧ください。

• Hooksの紹介では、なぜHooksをReactに追加するのかを説明しています。
• Hooksの概要は、ビルトインHooksの速習概要です。
• 独自のHooksの作成は、カスタムHooksによるコードの再利用を示しています。
• React Hooksを理解するでは、Hooksによって実現される新しい可能性を探ります。
• useHooks.comは、コミュニティが維持するHooksのレシピとデモを紹介しています。

ぜひ、あなたのアプリで試してみてください。私たちと同じように、再利用の素晴らしさを感じていただければ幸いです。

📱 JSCのアップデートによるパフォーマンス向上とAndroidでの64ビットサポート​

React Nativeは、アプリケーションの動作にJSC（JavaScriptCore）を使用しています。AndroidのJSCは数年前のもので、多くの最新のJavaScript機能がサポートされていませんでした。さらに悪いことに、iOSの最新のJSCと比較してパフォーマンスが低かったです。このリリースで、すべてが変わります。

@DanielZlotin、@dulmandakh、@gengjiawen、@kmagiera、そして@kudoによる素晴らしい作業のおかげで、JSCはここ数年の進歩を取り込みました。これにより、64ビットサポート、最新のJavaScriptサポート、そして大幅なパフォーマンス向上がもたらされます。今後のWebKitの改善をそれほど苦労せずに活用できるよう、このプロセスを維持可能なものにしたことにも称賛を送ります。そして、この作業を可能にしてくれたSoftware MansionとExpoに感謝します。

💨 インラインrequireによるアプリ起動速度の向上​

私たちは、デフォルトで高性能なReact Nativeアプリを提供することを目指しており、Facebookの最適化をコミュニティにもたらすために取り組んでいます。アプリケーションは、起動速度を低下させるのではなく、必要に応じてリソースをロードします。この機能は「インラインrequire」と呼ばれ、Metroが遅延ロードするコンポーネントを特定できるようにします。深く多様なコンポーネントアーキテクチャを持つアプリは、最も大きな改善が見られます。

デフォルトで有効にする前に、コミュニティの皆様に動作状況を知らせていただく必要があります。0.59にアップグレードすると、新しいmetro.config.jsファイルが作成されます。オプションをtrueに切り替えて、フィードバックをお寄せください！インラインrequireの詳細については、パフォーマンスドキュメントでアプリのベンチマーク方法を確認してください。

🚅 Lean coreの進行状況​

React Nativeは、複雑なリポジトリを持つ、大規模で複雑なプロジェクトです。これにより、コードベースは貢献者にとってアクセスしにくくなり、テストが難しくなり、開発依存関係として肥大化します。Lean Coreは、より良い管理のためにコードを個別のライブラリに移行することでこれらの問題に対処するための取り組みです。過去数回のリリースでは、その最初のステップが行われてきましたが、真剣に取り組んでいきましょう。

追加のコンポーネントが正式に非推奨になったことに気付くかもしれません。これは素晴らしいニュースです。これらの機能を積極的にメンテナンスする所有者がいるからです。警告メッセージに従って、これらの機能の新しいライブラリに移行してください。将来のリリースで削除されるためです。以下は、コンポーネント、そのステータス、移行先の表です。

今後数ヶ月で、さらに多くのコンポーネントがLean Coreへと移行していきます。この作業のお手伝いをお願いします—Lean Coreの包括的な課題にアクセスしてご協力ください。

👩🏽‍💻 CLIの改善​

React Nativeのコマンドラインツールは開発者にとってエコシステムへの入り口ですが、長年の問題を抱えており、公式サポートが不足していました。CLIツールは新しいリポジトリに移行され、専用のメンテナンスチームがすでにいくつかのエキサイティングな改善を行いました。

ログのフォーマットが大幅に改善されました。コマンドはほぼ瞬時に実行されるようになりました—違いをすぐに実感できるでしょう。

🚀 0.59へのアップグレード​

React Nativeのアップグレードプロセスに関する皆様からのフィードバックを参考に、今後のリリースでエクスペリエンスを改善するための措置を講じています。0.59にアップグレードするには、rn-diff-purgeを使用して、現在のReact Nativeバージョンと0.59の違いを確認し、それらの変更を手動で適用することをお勧めします。プロジェクトを0.59にアップグレードしたら、新しく改善されたreact-native upgradeコマンド（rn-diff-purgeに基づいています！）を使用して、新しいリリースが利用可能になるにつれて0.60以降にアップグレードできます。

🔨 破壊的変更​

0.59のAndroidサポートは、Googleの最新の推奨事項に従って整理されました。これにより、既存のアプリが破損する可能性があります。この問題は、ランタイムクラッシュと「このアクティビティにはTheme.AppCompatテーマ（またはその派生）を使用する必要があります」というメッセージとして表示される場合があります。プロジェクトのAndroidManifest.xmlファイルを更新し、android:theme値がAppCompatテーマ（例：@style/Theme.AppCompat.Light.NoActionBar）であることを確認することをお勧めします。

新しく改善されたreact-native upgradeコマンドに置き換えるため、react-native-git-upgradeコマンドは0.59で削除されました。

🤗 感謝​

多くの新しい貢献者の方々がFlow型からのネイティブコードの生成の有効化とXcodeの警告の解決に貢献してくれました—これらはReact Nativeの動作方法を学習し、より大きな利益に貢献するための素晴らしい方法です。ありがとうございます！今後同様の問題にご注目ください。

これらは私たちが注目したハイライトですが、他にも多くのエキサイティングなアップデートがあります。すべてのアップデートを見るには、変更ログをご覧ください。0.59は巨大なリリースです—皆様に試していただけることを楽しみにしています。

今年後半にもさらに多くの改善を予定しています。ご期待ください！

Ryan氏とReact Nativeコアチーム全員

待望のReact Native 0.56バージョンがリリースされました🎉。このブログ記事では、この新リリースで導入された変更点の一部をハイライトします。また、3月以降に取り組んできたことについても説明します。

破壊的変更のジレンマ、または「いつリリースするか？」​

コントリビューターガイドは、React Nativeへのすべての変更が通過する統合プロセスを説明しています。このプロジェクトは多くの異なるツールで構成されており、すべてが適切に動作するように、調整と継続的なサポートが必要です。それに、プロジェクトに貢献する活気のあるオープンソースコミュニティを加えると、その規模の壮大さがわかります。

React Nativeの素晴らしい普及に伴い、破壊的変更は細心の注意を払って行う必要があり、プロセスは私たちが望むほどスムーズではありません。コアチームが新しい破壊的変更のセットを統合およびテストできるように、4月と5月のリリースをスキップするという決定が下されました。専用のコミュニティコミュニケーションチャネルが途中で使用され、2018年6月（0.56.0）のリリースが、安定版リリースを辛抱強く待っていた人々にとって、できるだけ問題なく採用できるようにされました。

0.56.0は完璧ですか？ いいえ、世の中にあるすべてのソフトウェアと同様に完璧ではありません。しかし、「より多くの安定性を待つ」ことと「テストが成功した結果につながったので前進できる」ことのトレードオフにおいて、リリースの準備が整ったと感じています。さらに、最終的な0.56.0リリースでは解決されていないいくつかの 問題 が あることを認識しています。ほとんどの開発者は、0.56.0にアップグレードする際に問題はありません。上記の問題によってブロックされている開発者の皆様には、私たちのディスカッションに参加していただき、これらの問題の解決策を一緒に探していきたいと考えています。

0.56.0は、より安定したフレームワークに向けた基本的な構成要素と考えることができます。すべてのエッジケースが解決されるまでには、おそらく広範囲な採用に1週間から2週間かかるでしょうが、これにより、2018年7月（0.57.0）のリリースがさらに向上します。

このセクションの最後に、アプリをさらに向上させるのに役立つ合計818コミット（！）に取り組んだ67人のコントリビューター全員に感謝の意を表したいと思います👏。

では、これ以上遅延することなく…

大きな変更点​

Babel 7​

ご存じのとおり、私たち全員がJavaScriptの最新かつ最高の機能を使用できるようにするトランスパイラツールであるBabelは、近日中にv7に移行します。この新しいバージョンにはいくつかの重要な変更が含まれているため、Metroがその改善点を活用できるように、今がアップグレードする良い時期だと感じました。

アップグレードで問題が発生した場合は、関連するドキュメントセクションを参照してください。

Androidサポートの近代化​

Androidでは、周囲のツールの多くが変更されました。Gradle 3.5、Android SDK 26、Fresco 1.9.0、およびOkHttp 3.10.0、さらにはNDK APIターゲットをAPI 16に更新しました。これらの変更は問題なく行われ、ビルド速度が向上するはずです。さらに重要なのは、これにより開発者は、来月発効する新しいPlayストアの要件を遵守できるようになることです。

これに関して、実現可能にするために多くのPRを送信してくれたDulmandakh氏に特に感謝したいと思います👏。

この方向に進むには、さらにいくつかの手順が必要です。Androidサポートの更新に関する今後の計画と議論は、専用のissue（およびJSCに関する補足的なissue）で確認できます。

新しいNode、Xcode、React、Flow – わぁ！​

Node 8がReact Nativeの標準になりました。実際にはすでにテストされていましたが、Node 6がメンテナンスモードに入ったため、本格的に導入しました。Reactも16.4に更新され、多くの修正が加えられました。

iOS 8のサポートを終了し、ターゲットにできる最も古いiOSバージョンをiOS 9にしました。iOS 8を実行できるデバイスはすべてiOS 9にアップグレードできるため、これが問題になることはないと予想しています。この変更により、古いiOS 8を実行しているデバイスの回避策を実装した、ほとんど使用されていないコードを削除することができました。

継続的インテグレーションツールチェーンは、Xcode 9.4を使用するように更新され、すべてのiOSテストがAppleが提供する最新の開発ツールで実行されるようにしました。

Flow 0.75にアップグレードして、多くの開発者が高く評価している新しいエラー形式を使用しました。また、さらに多くのコンポーネントの型を作成しました。まだプロジェクトで静的型付けを適用していない場合は、実行時ではなくコーディング時に問題を特定するためにFlowを使用することを検討してください。

そして、その他多くのこと…​

たとえば、YellowBoxは新しい実装に置き換えられ、デバッグが大幅に改善されました。

完全なリリースノートについては、完全な変更ログはこちらを参照してください。また、この新しいバージョンへの移行で問題が発生しないように、アップグレードガイドを常に確認してください。

最後に、今週からReact Nativeコアチームは毎月のミーティングを再開します。カバーされている内容をすべての人に確実に最新の状態に保ち、今後のミーティングのために皆様からのフィードバックを常に活用できるようにします。

皆様、楽しいコーディングを！

Lorenzo氏、Ryan氏、およびReact Nativeコアチーム全員

PS: 常に、React Nativeはまだ多くの変更が進行中であるため、0.xのバージョン管理であることを思い出させてください。そのため、アップグレード時には、何かがクラッシュしたり壊れたりする可能性があることを忘れないでください。問題やPRの提出時には互いに助け合い、適用されている行動規範(CoC)に従ってください。画面の向こうには常に人間がいることを忘れないでください。