I'm building my first mobile app and am loving what React Native has to offer. One major disadvantage I've encountered is that the Navigator does NOT unmount the scene when a new scene is pushed on the stack. This makes some sense as this is probably necessary for transitions to happen smoothly.
My app uses a video background and seems like other apps using large media files may encounter a similar issue of high and unnecessary resource usage due to this behavior. Maybe a better approach would be to unmount the scene after transition and remount before popping?
I wonder if others have experienced similar issues and may have some feedback. I've already tried ExNavigator and React-Native-Redux-Router. These libraries are just not mature enough for my use cases and seem to have trouble working with Hot-Reloading.
Thanks for reading and replying.
I wouldn't use React-Native-Redux-Router, its not mainted and was taken over with React-Native-Router-Flux, i used to use RNRF, but have swapped to exponents ex-navigation (https://github.com/exponentjs/ex-navigation), and stay away from Navigator if you're going to start wanting more "complex" apps, as it is no longer maintained, though it does work still.
Which ExNavigator did you use because exponents one is well maintained and extremely fluid so far for what I have been doing, and should fit for most use cases.
If you want to stick with Navigator have you tried replace(route) or the resetTo(route) though you won't have transitions
Related
None of the modules that provide gesture capabilities work as expected in production IOS, they only work if you hold your finger lightly and slide very slowly over the element. All modules behave the same except for the react-native-gesture-handler, which is used by react-navigation.
UPD: My project uses eva-design/eva, ui-kitten/components, ui-kitten/eva-icons, mobx, mobx-react, react-native-screens, react-navigation/drawer, react-navigation/native, react-navigation/stack, react-native-ux-cam. I have suggestions that these modules may somehow affect this.
After much research, I found the reason. After removing the react-native-ux-cam, gestures work adequately
I have a native app on iOS with >90 screens.
My client wants an android version and we might use reactnative.
Now the question: Is react native ok for an app with >90 screens?
there are no special navigation or animations effects.
I was reading about airbnb dropping react native
They had many reasons, one being the number of screens they use > 100... but with special customizations.
So, is it safe to use react native in my not so specialized app with lots of screens?
I'd say this is more personal opinion than a technical answer. Either way, I'll give mine.
You're not likely to see any performance deficit by using a high number of screens, especially if they all carry little amounts of logic, however from a design point of view it could get quite messy - is there a reason you'll need such a high number of screens?
You're also likely to find your navigation stacks become incredibly confusing with so many screens in each, you'd end up with a huge file and readability could become difficult.
Could you design in a way such that a screen can dynamically display this content rather than moving from screen to screen each time?
I'd say, unless you're looking at building an app as technically complicated as AirBnB, you could cut down the numbers. I built the mobile app for a large UK retailer and we managed this in less than 20 screens so it's definitely do-able.
Hello Guys is this a good stuff in React native Environment I create all Scenes as Components and being rendering it without using react navigator or something like that ?
It depends on the size of app. If it's a very simple ui and functionality then it's ok but not good. Bu if it has so much screens and have complex functionalities, then break it down to different screens and use navigation. In fact it would be a good practice to use different screens and navigation. It also is good practice for memory management.
I want to render a three-dimensional cube with images on its six surfaces in React Native, that can be rotated by the user. First, I wanted to use react-native-canvas, but 3D rendering isn't possible within such a canvas.
My second idea was a Web View, that is shown in React Native and that renders the cube. The big disadvantage of this solution is, that a internet connection is necessary. Furthermore, maybe the performance isn't that good this way.
So, do you have any idea how to solve my problem? Thanks for all responds.
I would recommend you use a javascript framework called three.js. it is designed to do exactly what you are looking for.
I've been digging deep in React Native for the past week to decide if I and the team should adopt it. And I gotta say it seems promising. I've also learned about its ability to integrate with existing native projects and its incremental adoption to change existing native projects.
My question is what are the cases/reasons that would make me wanna convert my completed old native projects (iOS/Android) into React Native?
Edit: Just to clarify, our team is currently building native apps only.
It depends on what type of app you are building. But you can always use bits of code from native or react native. Since you all can code in native, anything you cannot find you could make a native component.
The advantages of React Native show up with code reuse between iOS and Android so that your team can iterate faster working together. Many big apps have achieved 80% or more code reuse.
You will find flexbox so easy to quickly create views to specs and to change quickly with styles. Plus they are all in code and that plays nice with git.
See edit below:
Now in saying this I have never used React Native inside a native project but to call actions and such you would need to expose functions to call from the JavaScript side. I don't know if a singleton is generally used or just an import of the controller functions or delegated you want to expose but it has to call back to the native application . It is easy to use a native component inside a React native application and I have done this so I am sure it can work the other way.
Edit: Out of curiosity I added some react native views to a test project and it works surprisingly well. No singleton needed Javascript maps the view tag and the exported functions. Crazy. The concerns below still exist but I think if you are changing to change that is wrong but if you have UI changes you want to make then it could definitely benefit as your reuse can grow across your platforms.
Drawbacks I have seen- sometimes transition animations can be laggy if you are not using the native navigation methods. Using both native and React Native adds size to your app so you would need to keep an eye on that. Also start up time can hurt and so monitor that as well.
With all that said I have built a fair bit with React Native lately and it is, at times, beautiful and frustrating for a native developer.
Here is a great article on Instagram and React Native.
Also AirBnb heavily uses RN. They may be completely RN now but I am not sure. They do drive a lot of the outside frameworks in RN for example the maps component in RN. They also just released Lottie and it is very cool. Here is an article about AirBnb.