Dan Neciu’s Post

🤯 I wrote an article about why you don't need useEffect (like the docs). Then I turned it into an AI skill that enforces it automatically 👇 Every time I post a React code snippet, someone tells me I shouldn't use useEffect there. And every time, someone else argues I should. So I wrote the definitive guide. One question decides everything: is this syncing with an external system? If the answer is no, there's a better alternative for every case: 1️⃣ Transforming data? Just calculate it during render. The useEffect version renders with stale data first, then re-renders with the correct data. Two passes for something that could be zero. 2️⃣ Resetting state on prop change? Use the key prop instead of watching props in an effect. React unmounts the old component and mounts a new one, automatically resetting all state, including child components you forgot about. 3️⃣ Chaining effects? When selecting a country triggers an effect that resets the city, which triggers another effect that resets the district, you get three re-renders painting intermediate states nobody needs. Move all downstream resets into the event handler that started the chain, and React batches them into a single render. 4️⃣ Fetching data? useEffect works here, technically, since the network is an external system. But you'll need to handle race conditions, caching, deduplication, and background revalidation yourself. At that point you've built TanStack Query, so just use TanStack Query. 5️⃣ Subscribing to an external store? useSyncExternalStore prevents tearing during concurrent renders, something your useEffect version won't catch until your app gets complex enough for React to split work across frames. I also packaged the full decision tree as a Claude Code skill. Two commands to install, and it forces the AI to ask the same question you should be asking before every useEffect. The article covers the ESLint plugin for catching these patterns mechanically too, which is honestly more useful long-term than any article because it keeps working after the person who read this leaves the project. Link to the full article in the comments 👇 Are you still reaching for useEffect by default, or have you already trained yourself out of it? #React #JavaScript #WebDev #CleanCode #TanStackQuery

  • text

This is absolutely straightforward. Nice. But how do we test the business logic involved in retrieving shippingCosts, Dan Neciu? There are 5 logical branches hidden behind it (that inline ternary).

I'm wondering—why use separate useState hooks for country, city, and district instead of combining them into one state object....

I have a question here, what if I want to subscribe to events or add event listeners? Is usEffect good for this or is there another way?

Like
Reply

what i did was gave the you probably do not need an effect page from react docs to cursor and asked it to make a skill, and now it follows it.

See more comments

To view or add a comment, sign in

Explore content categories