Start naming your useEffect functions, you will thank me later
Naming useEffect callback functions instead of using anonymous arrow functions is a small syntactic change with outsized benefits. Named effects make components scannable at a glance, improve stack traces in error monitoring tools like Sentry, and surface design problems: if you struggle to name an effect without using 'and', it's doing too much and should be split. The naming discipline also reveals effects that shouldn't exist at all â derived state, event handler logic, or state-to-state sync that belongs elsewhere. The post walks through a real inventory sync component, shows before/after comparisons, discusses when to prefer custom hooks vs. inline named functions, and shares a story where naming five Mapbox effects led to consolidating them into three cleaner ones.