React Navigation против React Native Navigation

Я просто хочу узнать честную, опытную и объективную точку зрения об этих двух решениях для реализации навигации в React Native:

Что лучше и почему. Спасибо


react-native react-navigation react-native-navigation performance
person Edwin Vargas    schedule 24.05.2017    source источник
comment
Стоит ознакомиться с официальной документацией: reactnative.dev/docs/navigation.html.   -  person Divyanshu Maithani    schedule 02.03.2020

Ответы (3)


arrow_upward
92
arrow_downward

НОВАЯ РЕДАКЦИЯ: с сегодняшнего дня (07/2020) я предлагаю использовать React Navigation v5. Это решение сообщества, которое больше всего продвигает Facebook. Переписанная версия V5 полностью изменила правила игры и намного превосходит предыдущие версии. Простота настройки и внедрения простых/сложных стеков в большинстве случаев не составляет труда.

Если вам это не подходит, другой альтернативой является react-native-navigation. от WIX (к сожалению, несовместимо с экспо).

React Native Navigation, как следует из названия, использует нативные модули с мостом JS. , поэтому производительность будет/может быть лучше. Для этого требуется встроенная интеграция.

В то время как React Navigation – это простое и мощное решение, предоставляемое самим реагированием. Это полностью реализация JS, в отличие от другой, которая использует встроенную поддержку, что может быть сложно. Просто npm-install и все готово...

Используйте реагирующую навигацию, если вы предпочитаете полную реализацию JS, и используйте нативную навигацию, если ваш главный приоритет — производительность.

  • Обе библиотеки претерпели кардинальные изменения и вошли в следующие стабильные версии. Реактивная навигация теперь более стабильна и производительна. Если вам нужно обрабатывать сложные вычисления в js, используйте react-native-navigation. но в большинстве случаев реактивная навигация вам подойдет!
  • С появлением react-native-screens оптимизация встроенного экрана стала возможной для реагирование-навигация, используя собственный компонент навигации (UIViewController для iOS и FragmentActivity для Android) см. здесь

Для тех, кто смотрит с точки зрения взаимодействия с пользователем, обе обеспечивают почти идентичные анимации и поток, так что вы не будете знать, какая библиотека используется за кулисами. Основное отличие заключается в нативной стороне, которая может повысить производительность (что крайне важно для лучшего взаимодействия с пользователем)

Обе библиотеки являются одними из лучших навигационных решений для React Native. Используйте его в соответствии с вашими потребностями/предпочтениями.

person Victor    schedule 24.05.2017
comment
Учитывая, что React Navigation до сих пор находится в beta и полно раздражающих ошибок, примите во внимание и стабильность. Что касается меня, то я так разочарован React Navigation, что попробую React Native Navigation. Да пустая трата времени... Если бы Facebook дал нам немного времени, прежде чем покинуть Навигатор... - person MacKentoch; 10.09.2017
comment
Реактивная нативная навигация потрясающая. В react-navigation отсутствуют очень важные методы жизненного цикла, такие как isFocused или onLeave. - person Jeungmin Oh; 09.02.2018
comment
isFocused и другие методы/события жизненного цикла есть в v2: reactnavigation.org/ docs/en/with-navigation-focus.html#docsNav reactnavigation .org/docs/en/navigation-events.html#docsNav - person Estevão Lucas; 18.09.2018
comment
Ответ не дает ни малейшего представления о том, есть ли существенная разница для пользовательского опыта. Лучшая производительность не означает заметной разницы для пользователя, поэтому я все еще не уверен, есть ли какая-то реальная разница для пользователей между этими вариантами, и это то, что я хотел бы знать. - person jacmkno; 20.02.2019
comment
React navigation v3 несовместим с Redux. - person optim1st; 27.02.2019
comment
@optim1st Неправильно! вы можете использовать редукцию с последними версиями. Убедитесь, что вы следуете репозиторию примеров инструкций: github.com/victorkvarghese/react-native-boilerplate - person Victor; 09.03.2019

arrow_upward
3
arrow_downward

Реагируйте на нативную навигацию, используя нативную навигацию, обернув каждый экран нативным контроллером. Таким образом, производительность оптимизируется собственной областью. Область, которую вы собираетесь реализовать, находится внутри заголовка и панели вкладок.

React Navigation — это чистая реализация js. Он использует React-native root view в качестве представления контейнера. Каждый экран находится под корневым иерархическим деревом представления.

Поэтому, если вы откроете приложение из консоли View Hierarchy, вы увидите большую разницу (React Navigation включает в себя кучу странных компонентов, таких как несколько заголовков или панель вкладок, дерево также сложно понять).

person Maolei Tang    schedule 07.03.2019

arrow_upward
3
arrow_downward

Вам следует попробовать маршрутизатор навигации. Он обеспечивает лучшее из обоих миров: 100% нативную навигацию на iOS и Android и представление массива JavaScript для собственного стека экранов.

person graham mendick    schedule 11.05.2019