web-dev-qa-db-ja.com

ReactナビゲーションとReactネイティブナビゲーション

ナビゲーションをReact Nativeで実装するために、これら2つのソリューションについて正直で経験豊富で目立たない視点を知りたいだけです。

どちらが良いのか、そしてなぜなのか。ありがとう

62
Edwin Vargas

React Native Navigation 名前が示すように、JSブリッジでネイティブモジュールを使用するため、パフォーマンスが向上する場合があります。ネイティブ統合が必要です。

React Navigation は、react native自体が提供するシンプルで強力なソリューションです。トリッキーなネイティブサポートを使用する他とは異なり、すべてJS実装です。 npm-installだけで、準備完了です...

all JS実装を好む場合は反応ナビゲーションを使用し、優先度がperformanceにある場合はネイティブナビゲーションを使用します。

両方のライブラリは、React Nativeに最適なナビゲーションソリューションです。必要に応じて使用してください。

UPDATE:両方のライブラリが大幅に変更され、次の安定バージョンになりました。反応ナビゲーションがより安定し、パフォーマンスが向上しました。 jsで複雑な計算を処理する必要がある場合は、react-native-navigationに進みます。しかし、ほとんどの場合、反応ナビゲーションはあなたのために動作します!

UPDATE 2react-native-screens の登場により、ネイティブナビゲーションコンポーネント( iOS用UIViewController、Android用FragmentActivity) こちらを参照

ユーザーエクスペリエンスビューから見ている人には、どちらもほぼ同じアニメーションとフローを提供するため、舞台裏でどのlibが使用されているかわかりません。主な違いは、パフォーマンスを向上させることができるネイティブ側です(ユーザーエクスペリエンスを向上させるために重要です)

68
Wolverine

ナビゲーションルーター を試してください。 iOSとAndroidの100%ネイティブナビゲーションと、画面のネイティブスタックのJavaScript配列表現の両方の長所を提供します。

1
graham mendick

各画面をネイティブコントローラーでラップすることにより、ネイティブナビゲーションを使用してネイティブナビゲーションを反応させます。したがって、パフォーマンスはネイティブレルムによって最適化されます。実装する領域は、ヘッダーとタブバーの内側です。

React Navigationは純粋なjs実装です。コンテナビューとしてReactネイティブルートビューを使用します。各画面は、ルートビューの階層ツリーの下にあります。

したがって、View Hierarchyコンソールからアプリを開くと、大きな違いが見られます(React Navigationには、複数のヘッダーやタブバーなどの奇妙なコンポーネントが多数含まれていますが、ツリーも理解しにくいです)。

0
Maolei Tang