2023-10-24
3068
#react
Jeremias Menichelli
12592
Oct 24, 2023 ⋅ 10 min read

A complete guide to React refs

Jeremias Menichelli Curious mind, writer, and developer.

Recent posts:

Why is Zod so slow?

Zod’s flexibility comes at a cost. This article breaks down why Zod is slower than AOT-compiled validators like Typia, and how to fix it with a build-time optimization that brings production-grade performance.

Ikeh Akinyemi
Oct 16, 2025 ⋅ 5 min read
the replay oct 15 graphic

The Replay (10/15/25): AI’s accessibility problem, React 19.2, and more

Discover what’s new in The Replay, LogRocket’s newsletter for dev and engineering leaders, in the October 15th issue.

Matt MacCormack
Oct 15, 2025 ⋅ 34 sec read
AI has an accessibility problem: What devs can do about it

AI has an accessibility problem: What devs can do about it

Jemima Abu examines where AI falls short on accessibility and how we can best harness AI while still building products that everyone can use.

Jemima Abu
Oct 15, 2025 ⋅ 10 min read

Want to run your AI model locally? Here’s what you should know

Cloud AI made scaling easy, but local AI brings control, cost stability, and data privacy. Explore the hardware realities, tradeoffs, and strategies shaping this shift.

Clara Ekekenta
Oct 15, 2025 ⋅ 6 min read
View all posts

11 Replies to "A complete guide to React refs"

  1. Thanks for this article, Jeremias. I use `useRef` and `createRef` extensively with my React code, which is entirely function, not class based, and extensively using Hooks. I’ve examined some `forwardRef` code and found it insanely complex and confusing so just used `window.###` functions instead.

  2. Little typo in the last sample, should be

    export default React.forwardRef(LabelledInput)

  3. The section about memory leaks seems a bit strange to me. Do you have sources that support your claim or explain why elements won’t be garbage collected when the component unmounts?
    If the component unmounts, it will be garbage collected eventually and subsequently any object that was referenced by the component (given there is no other reference to that element outside the component).

    More generally, I would assume that anything I put in a ref (and don’t reference anywhere else) will be garbage collected after the component un-mounts and is itself garbage collected.

Leave a Reply