---
title: Notify Parents via Handlers, Not Effects
impact: MEDIUM
impactDescription: avoids sync issues and extra renders from effect-based notifications
tags: effect, event-handler, optimization, custom
---

# Notify Parents via Handlers, Not Effects

```tsx
// BAD: effect to notify parent
useEffect(() => { onChange(isOn) }, [isOn, onChange])

// GOOD: update together in handler
function handleClick() {
  const next = !isOn
  setIsOn(next)
  onChange(next)
}

// BEST: lift state to parent (controlled component)
function Toggle({ isOn, onChange }) {
  return <button onClick={() => onChange(!isOn)}>{isOn ? 'ON' : 'OFF'}</button>
}
```