Clash Royale CLAN TAG#URR8PPP

Best practices for conditional rendering in react-native

I would like some advice as to the best practice when conditionally rendering an element or component in react-native. My question is when the conditional is not true is it better to return null or just run the if condition? I understand that if you return null then the lifecycle methods are still run but my concern is if i do not return anything is there an impact or performance difference?

Example One

renderText(name)
if(name === 'Abba')
return <Text>name</Text>




Example Two

renderText(name)
if(name === 'Abba')
return <Text>name</Text>
else
return null




null

return name === 'Abba' ? <Text>name</Text> : null

&&

name === 'Abba' && <Text>name</Text>

1 Answer
1

I think conditional rendering like this might be better.

renderText(name)
return (
name === 'Abby' &&
<Text>
name
</Text>

)



By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.