Separate Libraries under Lean core Project in React Native Version 0.59

Project Lean Core:

For the past several months React Native Core Community has been discussing and making progress on a project called “Lean Core”. Over the years React Native has accumulated a lot of parts that are now outdated, unused or otherwise legacy.

Question:

So the big point of discussion was “React Native is a huge repo. Would it make sense to move UI components (ScrollView, Switches, WebView) and Native Modules like PushNotifications, etc into separate repos?”

Answer:

The basic answer was yes, and in the past few months, this has started becoming reality via a few proposals and some commits from the FB team. They decided that it’s time to clean everything up and put the repository into a much more manageable state going forward.

Result:

In the process of that, they have moved many React Native component to a new Home like AsyncStorage is deprecated from the react-native library and now has a new separate library react-native-async-storage. AsyncStorage is not just a single library there are many libraries which have been already moved and can be used from there. Don’t Worry I’ll make a separate post for that to list out the libraries that are moved to a new place.

Updated Posts under Lean Core Project:

  1. AsyncStorage in React Native to Store Data in Session.
  2. React Native NetInfo.
  3. Example to Show the Working of Slider in React Native.

Many more to come. Keep updated and keep visiting this post.

`react-native link` without package name is Deprecated

This post is regarding the deprecation of react-native link without the package name. If you are using a library with some native functionality then you need to make some changes in the Android and IOS files.

There are two ways to do that:

  1. Do it manually.
  2. Using react-native link which is a CLI command to do the changes automatically.

Previously if we talk about the linking of the library then there was not a compulsion to define the library name but in the upcoming release, you need to define the library name compulsory.

If you run the react-native link on the terminal to link the library you can see the warning regarding that.

To remove this warning make sure to add library name while linking.

So the conclusion is:

Before:

react -native link / react -native link react-native-maps (Both are legal).

In the upcoming update :

react -native link react-native-maps (Compulsion to define the library name).

 

 

Warning: ListView is deprecated and will be removed in a future release

This post is about the Warning: ListView is deprecated and will be removed in a future release. If you are a React Native developer and working with a ListView then you have seen a warning coming nowadays and that is

Warning: ListView is deprecated and will be removed in a future release. See https://facebook.github.io/react-native/blog/2017/03/13/better-list-views.html for more information.

This warning is there because ListView is deprecated and as per the announcement on March 13, 2017.

We are officially announcing them today! No more ListViews or DataSources, stale rows, ignored bugs, or excessive memory consumption – with the latest React Native March 2017 release candidate (0.43-rc.1) you can pick from the new suite of components what best fits your use-case, with great perf and feature set out of the box.

According to that, you have to keep remember to use FlatList or SectionList instead of ListView as per your need.

FlatList

This is a component for simple, performant lists. Just provide an array of data and a renderItem function:

SectionList

If you want to render a set of data broken into sections, maybe with section headers. renderSectionHeader for the header renderItem for the content under the header and an array of sections.

The new list components have significant performance enhancements, the main one being nearly constant memory usage for any number of rows.

This is done by ‘virtualizing’ elements that are outside of the render window by completely unmounting them from the component hierarchy and reclaiming the JS memory from the React components, along with the native memory from the shadow tree and the UI views.

If you want to read more about the Reason, Performance, Advanced Usage and Future Work you can visit here.