One of the most common reasons of performance issues are memory leaks. In this article, we gathered the typical approaches to debug and solve memory problems in a React Native app. If your app happens to suffer from memory issues, you will learn how to tell if your app is leaking memory, and if so, how to pinpoint and fix the source of the leak.

In JavaScript memory is managed automatically by Garbage Collector (GC). In short, Garbage Collector is a background process that periodically traverses the graph of allocated objects and their references. If it happens to encounter a part of the graph that is not being referenced directly or indirectly from root objects (e.g., variable on the stack or a global object like window or navigator) that whole part can be deallocated from the memory.

In React Native world each JS module scope is attached to a root object. Many modules, including React Native core ones, declare variables that are kept in the main scope (e.g., when you define an object outside of a class or function in your JS module). Such variables may retain other objects and hence prevent them from being garbage collected.

 

Here is a list of most common mistakes in React Native apps that can lead to memory leaks:
1. Unreleased timers/listeners added in componentDidMount
2. Closure scope leaks

Does my app leak memory?

Usually, it is quite difficult to tell if the app is leaking — especially that sometimes the leaks are so small that it is virtually impossible to notice. The best approach is to analyze a workflow within your app that you would expect to be memory neutral, i.e., a sequence of steps that should not lead to any new objects being retained. For example, navigating to a new screen and going back to the previous, or adding and removing items from a list are both scenarios that in most cases should not increase memory usage. If such a workflow leads to leaking, you should notice your app’s memory consumption to grow after you repeat it several times.

 

If you want to know more about memory leaks please read whole article on the blog:

https://blog.swmansion.com/hunting-js-memory-leaks-in-react-native-apps-bd73807d0fde

The React Native technology will be a main topic on the App.js  conference.

The mobile applications market is booming nowadays. There is plenty of development environments that enable creating apps for iOS and Android. One of them is React Native, which allows writing applications that are compatible with both operating systems. Expo is a set of tools and libraries expanding React Native. App.js conference is organized by the creators of React Native and Expo as well as active contributors.

The conference already got positive feedback from the React Native community.

In addition to already listed ones, you can expect presentations and workshops by:

  • Nader Dabit from Amazon Web Services https://twitter.com/dabit3 –  AWS evangelist, creator of the React Native Radio
  • Peter Piekarczyk – one of the first Expo users, React Native enthusiast, currently working on drag’n’drop mobile app builder
  • Eric Vicenti – previously employed by Facebook, one of the fathers of React Native and its main contributor
  • Satyajit Sahoo from Callstack and Expo https://twitter.com/satya164 – one of the most active RN contributors

For more go to appjs.co.