React-Native Top Tips – DEV Community

Hello there !!

I’m again with a brand new Weblog. So this time I’ll cowl some attention-grabbing tips on React-Native which is a framework of JavaScript.
So let’s go together with 🐱 Suga this time :

React-Native High Ideas :

Earlier than transferring additional, let’s first talk about what React-Native is ? And what’s its use ?

React-Native :

React Native is an open-source UI software program framework created by Meta Platforms, Inc. It’s used to develop functions for Android, iOS, Net, Home windows and many others. by enabling builders to make use of the React framework together with native platform capabilities.

High Ideas :

Don’t go together with Expo : I do know it isn’t clever to say ‘Do not use Expo’. However that is the precise actuality. Beginning with Expo is sweet, however follow it, not. Virtually all tech giants do not go together with Expo as it isn’t that a lot succesful to deal with massive tasks. Additionally, group packages additionally very much less.

Take away all logs out of your launch builds : I feel on this world, there isn’t a such developer exist who do not use console.log() for debugging. Additionally, it’s extremely highly effective device however on the identical time if one neglect to take away console whereas packaging or releasing App then it should decelerate our App.

Use flex : If one need’s that our App works effectively, then one should depend on flex as an alternative of excessively utilizing
Top and Width utilizing Dimensions. Utilizing Dimension is sweet because it makes our App responsive however on the identical time depending on it is extremely painful as it should lower the effectivity of App as each time it used it calculate the scale of complete display screen and apply peak and width in line with our choice which enhance reminiscence utilization and thus effectivity decreases.

Reuse Types : Reusing types is an efficient follow in React-Native and scale back the repetitive code strains. For instance, in each display screen we’re giving some model to Beginning View. So in each display screen as an alternative of typing types of that View repeatedly one ought to create a typical model JavaScript file and use it all over the place we would have liked. We will additionally make completely different file for Colours, font Measurement, Card Fashion which will probably be reused in your complete App.

Use ternary operators concisely :
Writing coloration = error ? ‘pink’: ‘grey’ is brief and candy.
Writing coloration = error ? (id === ID) ? ‘pink’ : ‘black’ : ‘grey’ shouldn’t be.
Ternary operators may also help scale back the variety of strains in your code, however by no means nest them as a result of the logic turns into troublesome to learn.

React-Native Physician : react-native physician (accessible as part of React Native 0.62) is a particularly helpful command to assist us to repair issues together with your growth surroundings.

Fashion Overriding : Fashion Overriding is my one of many favorite tip. On this, one can override the model with out altering the ingredient in StyleSheet. Beneath is the syntax of it.

<View model={[styles.container , {backgroundColor : "purple"}]}>  
....
</View>
Enter fullscreen mode

Exit fullscreen mode

In order that’s it for right now’s weblog. I’ll provide you with one other attention-grabbing weblog with BTS 🧡 .

Add a Comment

Your email address will not be published. Required fields are marked *