flickering on page when switching between tabs

[stuontheblockchain]

Which package manager are you using? (Yarn is recommended)

yarn

Summary

when switching tabs for the first time the whole nested tab screen seems to flicker white

Minimal reproducible example

in root layout,
<Stack screenOptions={{headerShown: false}}/>
in root index,
<Redirect href='/screen1' />
in (tabs) directory layout,

  <Tabs>
     <Tabs.Screen  name='screen1' options={{headerShown: false}}/>
     <Tabs.Screen name='screen2' options={{headerShown: false}}/>
   </Tabs>

[devoren]

same issue, for now i set lazy prop to false

[davidhanlon23]

also having this issue, setting lazy prop to false helped until i needed to render images from urls on the screen

[stevan-borus]

same here.. any news on this?

[Dundyne]

Same issue here

[markanthonyuy]

Hope this will get more traction. I'm experiencing the same

[joghyrt]

Same issue here

[RiczCalixto]

Same issue here. Is it ok to set lazy prop to false or it might cause other problems?

[J-Boelen]

Same issue here

[tunadag]

Same issue here. Can anybody hear us?

[mleister97]

Same issue here. Is it ok to set lazy prop to false or it might cause other problems?

Setting lazy: false does indeed have side effects. every screen of the tab navigator will get mounted & rendered, causing e.g. tanstack-query to refetch all queries.