[fr] allow refs on SFCs

[quantizor]

Do you want to request a feature or report a bug?
feature

What is the current behavior?
refs on SFC do not currently work

What is the expected behavior?
taking a ref on a SFC should be the equivalent of calling findDOMNode and simply return the highest DOM node from the rendered output

[iamdustan]

A couple issues that would have to be overcome to make this a possibility:

• findDOMNode is host specific whereas refs are generic. Would need to convert to findHostNode that is injected into the reconciler when mounting. This would probably be really tricky and error prone from both the React side and user side.
• ReactDOM components can now return strings, numbers, or null. What would findDOMNode return here?
• refs on components are relatively cheap as is since they just return the instance. Having a ref turn into a much more expensive findDOMNode lookup call could cause performance issues that are difficult to fix and opaque to the developer while writing.
• There is the statelessness of SFCs to consider and explain as well.

#4936 has some more context on the reasoning behind this.

[quantizor]

1. Could it exist in a persistent cache property on the Fiber and just be copied over during diff? Then the cost would only be the initial findHostNode call on initial tree creation.

2. I'd say it would be the highest child node or null. Could be a text node, perhaps with a dev warning that the SFC doesn't return a root element and to add a span or something.

3. Being stateless doesn't prevent us from being able to access the rendered output. They're orthogonal I think.

[gaearon]

The goal of functional components is to be able to not create Fibers for them in the future in some cases. So I don’t think we can store any data associated with functional components.

[quantizor]

@gaearon the data for them has to be stored somewhere in the tree though right? Otherwise you wouldn't have been able to diff?

It occurred to me that only supporting callback refs for SFC would help solve the problem since the only time a lookup would need to happen is initial mount and then it's up to the consumer to handle the reference.

[gaearon]

Otherwise you wouldn't have been able to diff?

React does not diff composite props. It only diffs props for host components, e.g. <div>. Imagine those were function calls: they store no data but still allow to express the same thing.

[quantizor]

Gotcha. Callback ref should still solve the issue I believe since it's point in time and then the responsibility of maintaining the reference is on the consumer?

[gaearon]

The callback itself would have to live somewhere. findDOMNode is also slow with the new architecture and we want to discourage its further usage. If you need refs, you can pass them through like described here. Another way we could address this is #4213.