useEffect

React to data changes only

useEffect(() => {
 // logic
}, [dep])

✅ Runs when:

• The component mounts
• The dependency (dep) changes

❌ Does NOT run when:

• The screen is revisited (focused again)
• Navigation happens without changing the dependency

useFocusEffect

useFocusEffect(
 useCallback(() => {
 // logic
 }, [dep])
)

✅ Runs when:

• The screen becomes focused (opened or revisited)
• The dependency changes while the screen is focused

Even if dep did NOT change → it still runs on screen focus

🚨 Common Pitfall

Using useFocusEffect without resetting state or params:

if (isError) {
 // will trigger EVERY time screen is focused
}

👉 This can cause repeated side effects or bugs

✅ Best Practice

When using navigation params:

useFocusEffect(
 useCallback(() => {
 if (!isError) return

 handleSideEffect()

 // reset param to avoid repeated triggers
 NavigationFunctions.setParams({ isError: false })
 }, [isError])
)