How in React native destroy an component instance to avoid memory leak and release underlie views objects of native code?

Question

I want to destroy some component that i have instantiated to release memory. In my current app almost every view that i instantiate and then release it (remove reference to it) doesn't get garbage collected. I keep no reference to to views. I'm not sure if this memory leak is caused by my app or it's react-native(and react native have some memory leaks problems). is there a way to confidently destroy a view instance ?

Tonedeaf

Did you find the answer? – Hohenlinden

I'm also interested in this. Did you or @Hohenlinden find any insight? – Aerobiosis

UPDATE: this question is for early release of react-native and android <5, this problem has long time ago has been solved. – Tonedeaf

Answer 1

React will destroy a component when you don't render it anymore. or when you omit it from virtual DOM.

const [render, setRender] = useState(true)

<View>
   {render
     ? <HeavyComponent/>    
     : null
   }
   <AnotherComponent/>
</View>

Fellini

Answer 2

I've passed for the same problem time ago, and I discovered that the problem was I wasn't using correctly react.

Why are you instantiating components manually?

Think that one of big main features of reacts is the tree DOM virtual components and if you instantiate a component manually you are, in some way, avoiding it.

Remember that you should use the components in the render function, or functions where components are render and used in the render function. If you have to pass components to another components, you should use the concept of high order component.

I hope I've helped you.

Bobsled

A trick if you want to manipulate a little bit the component, you can use the function componentWillUnmount(). – Bobsled