「リリース」タグが付いた投稿19件

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

ハイライト​

• Androidで親の境界外にあるビューのタップを処理
• Androidの新しいBluetooth権限
• Apple Silicon、Xcode 13、iOS 15のサポート改善
• Hermes 0.9.0
• Nightlyおよび「Commitly」リリース

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

Hermes 0.8の新機能​

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

• 「Hades」という新しい並行ガベージコレクタを搭載し、64ビットデバイスでの一時停止時間を最大30倍短縮します。Facebookでは、これによりCPU負荷の高いワークロードの一部が20%～50%改善されました。Hadesの詳細はこちらでご確認ください。
• ECMAScript Internationalization 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はReact Native内のアクセシビリティを向上させるためGAAD誓約を結びました。0.65ではこの誓約の成果とその他のアクセシビリティ改善が共有されます！注目すべき変更点には以下が含まれます。

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

未解決のアクセシビリティの問題については、こちらで進捗を確認したり、貢献したりすることができます！

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

• package.jsonのdevDependencyとしてreact-native-codegenのバージョン0.0.7が必要になりました。
• JCenterがサービスを終了し、読み取り専用になりました。mavenリポジトリとしてJCenterを削除し、依存関係を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以上のコミットが含まれています。このリリースに貢献し、サポートしてくださった皆様に感謝いたします！完全な変更ログはこちらでご確認いただけます。

本日、React Native 0.64をリリースします。このバージョンではiOSでのHermesサポートが同梱されています。

iOSでのHermesオプトイン​

Hermesは、React Nativeの実行に最適化されたオープンソースのJavaScriptエンジンです。メモリ使用量を減らし、ダウンロードサイズを削減し、アプリが使用可能になるまでの時間（「time to interactive」（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サポートはまだ初期段階であることにご注意ください。現在もさらなるベンチマークを実施しているため、オプトインとして提供しています。ぜひご自身のアプリケーションで試してみて、どのように動作するかをお知らせください！

Inline Requiresがデフォルトで有効に​

Inline RequiresはMetroの設定オプションで、JavaScriptモジュールの実行を起動時ではなく使用されるまで遅延させることで、起動時間を改善します。

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

Inline Requiresは、モジュールのインポートをインラインに変換するBabelトランスフォームです。例として、Inline Requiresは以下のモジュールインポート呼び出しを、ファイルの先頭から実際に使用される場所へと変換します。

変換前

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>;
};

Inline Requiresに関する詳細はパフォーマンスのドキュメントをご覧ください。

ChromeでHermesのトレースを閲覧​

過去1年間、FacebookはMajor League Hacking fellowshipを支援し、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をオプトインとして導入しました。このリリースでは、LogBoxをReact Native全体のデフォルト体験としてローンチします。

LogBoxは、エラーや警告が冗長すぎる、フォーマットが悪い、またはアクションにつながりにくいという不満に対処するため、主に3つの目標に焦点を当てています。

• 簡潔であること（Concise）: ログは問題をデバッグするために必要な最小限の情報を提供するべきです。
• 整形されていること（Formatted）: ログは必要な情報をすぐに見つけられるように整形されるべきです。
• 実行可能であること（Actionable）: ログはアクション可能であるべきで、それによって問題を修正して先に進むことができます。

これらの目標を達成するために、LogBoxには以下の機能が含まれています。

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

これらのすべての機能を、エラーと警告で一貫性があり、すべてのログを快適なUIでページングできる、改善されたビジュアルデザインにまとめました。

この変更に伴い、YellowBoxは非推奨となり、LogBox APIに置き換えられます。

• LogBox.ignoreLogs(): この関数はYellowBox.ignoreLogs([])を置き換えるもので、指定された文字列または正規表現に一致するログを非表示にする方法です。
• LogBox.ignoreAllLogs(): この関数はconsole.disableYellowBoxを置き換えるもので、エラーや警告の通知をオフにする方法です。注意：これは通知を無効にするだけで、キャッチされなかったエラーは引き続きフルスクリーンのLogBoxを開きます。

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

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

Pressable​

React Nativeは、アプリケーションがプラットフォームのユーザーの期待に応えられるように構築されています。これには、「tell」（React Nativeで構築された体験であることを示す小さな手がかり）を避けることが含まれます。これらのtellの主要な原因の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という色を提供しています。これはReact NativeでPlatformColorを使って次のように使用できます。

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を使用している場合は、最新のセキュリティ修正と更新をすべて受けるためにアップグレードすることをお勧めします。

その他の注目すべき改善点​

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

謝辞​

0.63を可能にしてくれた何百人ものコントリビューターに感謝します！

LogBoxセクションの執筆を担当してくれたRick Hanlon、およびこの記事のPressable部分の執筆を担当してくれたEli Whiteに特別に感謝します。

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

本日、React Nativeバージョン0.62をリリースします。このバージョンには、デフォルトでFlipperのサポートが含まれています。

このリリースは世界的なパンデミックのさなかに発表されます。私たちは、このリリースを可能にした何百人もの貢献者の努力に敬意を表し、リリースがマスターからあまりにも遅れないようにするために、本日このバージョンをリリースします。貢献者が問題解決に協力する能力が低下していることを考慮し、必要であればアップグレードを遅らせる準備をしてください。

デフォルトでFlipperを搭載​

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

Flipperは、標準で以下の機能を提供します。

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

さらに、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の取り組みの一環として、またApple TVをReact Native WindowsやReact Native macOSのような他のプラットフォームと整合させるため、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のエラーおよび警告表示機能をオプトインとして追加します。有効にするには、`index.js`ファイルに`require('react-native').unstable_enableLogBox()`を追加してください。
• React DevTools v4: この変更には、最新のReact DevToolsへのアップグレードが含まれており、大幅なパフォーマンス向上、改善されたナビゲーション体験、およびReact Hooksの完全なサポートを提供します。
• アクセシビリティの改善: accessibilityValueの追加、Touchablesの不足プロパティ、onSlidingComplete アクセシビリティイベント、Switchコンポーネントのデフォルトロールを"button"から"switch"への変更など、アクセシビリティの改善を行いました。

破壊的変更​

• PropTypesの削除: React Nativeコアのアプリサイズへの影響を減らし、実行時ではなくコンパイル時にチェックする静的型システムを優先するため、コアコンポーネントから`propTypes`を削除しています。
• accessibilityStatesの削除: 非推奨のaccessibilityStatesプロパティを削除しました。これは、コンポーネントがアクセシビリティサービスにその状態に関する情報を記述するよりセマンティックに豊かな方法である新しいaccessibilityStateプロパティを支持するためです。
• TextInputの変更: onTextInputは一般的でなく、W3C準拠でもなく、Fabricでの実装が困難であるため、TextInputから削除しました。また、ドキュメントに記載されていないinputViewプロパティとselectionStateも削除しました。

非推奨​

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

謝辞​

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

すべての更新内容を確認するには、0.62の変更履歴をご覧ください。

この度、React Native 0.61 のリリースを発表できることを嬉しく思います。このバージョンには、私たちが「Fast Refresh」と呼ぶ新しいリロード体験が含まれています。

高速リフレッシュ​

React Nativeコミュニティに共通の不満点を尋ねたところ、最も多かった回答の1つは「ホットリロード」機能が壊れているということでした。関数コンポーネントでは信頼性が低く、画面が更新されないことが多く、タイプミスや間違いに強くありませんでした。信頼性が低すぎるため、ほとんどの人が無効にしているという声を聞きました。

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

• Fast Refresh は、関数コンポーネントやフックを含む、モダンな React を完全にサポートします。
• Fast Refresh は、タイポやその他のミスから適切に回復し、必要なときにはフルリロードにフォールバックします。
• Fast Refresh は、侵襲的なコード変換を行わないため、デフォルトで有効にできるほど信頼性があります。

Fast Refresh の動作については、こちらのビデオをご覧ください。

ぜひお試しいただき、ご意見をお聞かせください！もしお好みでなければ、開発メニュー（iOS では Cmd+D、Android では Cmd+M または Ctrl+M）でオフにできます。オンとオフの切り替えは瞬時に行えるので、いつでも変更できます。

Fast Refresh を使う上でのヒントをいくつか紹介します。

• Fast Refresh は、デフォルトで関数コンポーネント（およびフック！）の 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 フックの追加。 この新しいフックは、画面サイズの更新を自動的に提供し、購読します。ほとんどの場合、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コアチームはバージョン0.60のリリースを発表できることを誇りに思います。このリリースでは、AndroidとiOSの両プラットフォームで大幅な移行が行われ、多くの問題も解決されています。このブログ投稿では、リリースのハイライトについて説明します。ただし、詳細については常に変更ログを参照してください。最後に、このマイルストーンを達成するために協力してくださった貢献者の皆様に感謝いたします！

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

announceForAccessibilityのようなアクセシビリティAPIに多くの改善があり、さらにロール、アクションサポート、フラグなどにも改善が加えられました。アクセシビリティは複雑な科学ですが、これらの改善が少しでもA11Yを容易にすることを願っています。これらの変更の詳細については、React Native Open Source Update June 2019を必ず確認してください。

新たな始まり​

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プロジェクトの一部になりました。もしこれまでそうしていなかった場合、今後iOSプラットフォームコードを開く際には必ずxcworkspaceファイルを使用してください（ヒント: プロジェクトのルートディレクトリからxed iosを試してみてください）。また、内部パッケージのpodspecもXcodeプロジェクトと互換性があるように変更され、トラブルシューティングやデバッグに役立ちます。この素晴らしいサポートを導入するため、0.60へのアップグレードの一環としてPodfileにいくつかの簡単な変更を加えることが予想されます。use_frameworks!との互換性問題があることは認識しており、回避策と将来のパッチを含む問題を追跡しています。

リーンコアの削除​

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のコミットを含む、もう1つの大きなリリースです。貢献は他の形でも行われます。問題の維持、コミュニティの育成、React Nativeに関する人々の教育に感謝いたします。今月は多くの待望の変更がもたらされ、皆様にお楽しみいただければ幸いです。

🎣 Hooksが登場​

React Hooksはこのリリースの一部であり、コンポーネント間でステートフルなロジックを再利用できます。Hooksについては多くの話題がありますが、まだ聞いたことがない場合は、以下の素晴らしいリソースをご覧ください。

• Hooksの紹介では、なぜReactにHooksを追加するのかを説明しています。
• 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サポート、および大幅なパフォーマンス向上がもたらされました。この作業を可能にしてくれたSoftware MansionとExpoに感謝するとともに、将来のWebKitの改善をあまり手間をかけずに活用できるように、これを保守可能なプロセスにしてくれたことに拍手を送ります。

💨 インラインrequireによる高速なアプリ起動​

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

デフォルトで有効にする前に、コミュニティからどのように機能するかを教えていただく必要があります。0.59にアップグレードすると、新しいmetro.config.jsファイルが作成されます。オプションをtrueに設定して、ご意見をお聞かせください！アプリのベンチマークを行うには、パフォーマンスドキュメントでインライン要求について詳しく読んでください。

🚅 Lean Coreが進行中​

React Nativeは、複雑なリポジトリを持つ大規模で複雑なプロジェクトです。これにより、コードベースは貢献者にとって 접근しにくく、テストが困難で、開発依存関係として肥大化しています。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-git-upgradeコマンドは0.59で削除され、新しく改良されたreact-native upgradeコマンドが推奨されます。

🤗 感謝​

多くの新しい貢献者が、フロー型からのネイティブコード生成の有効化と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ストア要件に準拠するのに役立つことです。

これに関連して、特にDulmandakh氏に、これを可能にするために提出された多くのPRについて感謝したいと思います👏。

この方向でさらにいくつかの手順を踏む必要があります。Androidサポートの更新に関する将来の計画と議論は、専用の課題（およびJSCのサイドの課題）で追跡できます。

新しいNode、Xcode、React、Flow – 盛りだくさん！​

Node 8は、React Nativeの標準となりました。実際にはすでにテストされていましたが、Node 6がメンテナンスモードに入ったため、私たちは一歩踏み出しました。Reactも16.4に更新され、多数の修正がもたらされました。

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

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

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

その他多くのこと...​

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

完全なリリースノートについては、こちらの完全な変更ログを参照してください。また、この新しいバージョンに移行する際の問題を回避するために、アップグレードガイドに注意してください。

最後に：今週から、React Nativeコアチームは月例会議を再開します。会議でカバーされる内容を全員に最新情報として伝え、将来の会議のために皆さんのフィードバックを手元に置いておくようにします。

皆さん、ハッピーコーディング！

Lorenzo、Ryan、そしてReact Nativeコアチーム一同

追伸： いつものことながら、React Nativeはまだ0.xバージョンであり、多くの変更が進行中であることを皆さんに思い出させたいと思います。アップグレードする際には、はい、おそらく何かがクラッシュしたり破損したりする可能性があることを覚えておいてください。問題提起やプルリクエストの提出の際には、お互いに助け合いましょう。そして、実施されている行動規範に従うことを忘れないでください。画面の向こう側には常に人間がいます。