DEV Community

Discussion on: Implementing advanced usePrevious hook with React useRef

Collapse
 
thekashey profile image
Anton Korzunov

Thanks for the troughtfil article. Refs are awesome, as well as examples provided by you.

Two moments:

  • calling setState in the render body will cause the result of the current render to be rejected and component to be rendered again. So double render, but a single commit.
  • changing refs outside of useEffect is not always ConcurentMode or (Strict) compatible as corresponding Effects might be not triggered. In general one should be very accurate, ideally prefer double rendering over hard to trace bugs. See github.com/stripe/react-stripe-js/...
Collapse
 
adevnadia profile image
Nadia Makarevich

By render you mean DOM update here? Because the render function and everything that is within will be executed twice.

changing refs outside of useEffect is not always ConcurentMode or (Strict) compatible

Oh, interesting! In this case, if this causes problems, the refs-based logic can be moved into useEffect, still no need in duplicated renders.